/*
Theme Name: Steve Young World
Theme URI: https://www.steveyoungworld.com
Description: Theme created for Steve Young World
Author: Example7
Author URI: https://www.example7.com
Version: 1.0

  Colors
  ------
  Black    000
  Yellow   ffde00  255,222,0
  Red      d12428  209,36,40
  Blue     3778bc  55,120,188

  Webfonts
  --------
  Sanchez   'Sanchez'   400
  Muli      'Muli'      400

*/





/* ====================================================================
   Global
   ==================================================================== */

/* -------------------[ Layout ]------------------- */

body { 
  background-color: #FFF; 
}

#wrap { 
  width: 96%; max-width: 990px; min-height: 100%; margin: 0 auto; padding: 0 2%; 
}

#header,
#content,
#footer { 
  clear: both; 
  width: 100%; 
}

#content { 
  width: 90%; max-width: 890px; margin: 0; padding: 0; 
}

/* -------------------[ Type ]------------------- */

body, html { 
  color: #000; font-family: 'Sanchez', Georgia, "Times New Roman", Times, serif; font-size: 16px; line-height: 22px; 
}

/* -------------------[ Links ]------------------- */

a { 
  transition: .3s; -o-transition: .3s; -ms-transition: .3s; -moz-transition: .3s; -webkit-transition: .3s;
}

a:link, a:visited, a:active { 
  color: #3778bc; text-decoration: none; 
}

a:hover { 
  color: #000; text-decoration: none; 
}

/* -------------------[ Headers ]------------------- */

h1 { 
  clear: both; 
  margin: 0 0 30px 0; padding: 0;
  color: #3778bc; font-family: 'Muli'; font-size: 24px; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; 
}

h2 { 
  clear: both; 
  margin: 0 0 10px 0; padding: 0;
  color: #000; font-family: 'Muli'; font-size: 20px; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; 
}

h3 { 
  clear: both; 
  margin: -5px 0 30px 0; padding: 0;
  color: #000; font-family: 'Muli'; font-size: 13px; line-height: 16px; font-weight: 400; letter-spacing: 0; text-transform: uppercase; 
}

h6 { 
  display: inline-block; overflow: hidden; 
  max-width: 990px; width: 96%; margin: 15px auto; padding: 0 2%;
  color: #3778bc; font-family: 'Muli'; font-size: 23px; font-weight: 400; letter-spacing: 0.03em; text-transform: uppercase; text-align: center; 
}

h6:before,
h6:after {
  position: relative; display: inline-block;
  width: 50%; height: .1em; margin-bottom: .25em;
  border-top: 2px solid #3778bc; 
  content: "";
}

h6:before {
  right: .5em;
  margin-left: -50%;
}

h6:after {
  left: .5em;
  margin-right: -50%;
}

/* -------------------[ Quotes ]------------------- */

blockquote { 
  clear: both;
  width: 80%; margin: 25px auto; padding: 15px 5% 10px 5%;
  border-radius: 15px; 
  background-color: #fafafa;
}

q:before,
q:after {
  position: absolute; z-index: 1; 
  font-size: 35px; 
}

q:before {
  margin: 5px 0 0 -15px;
}

q:after {
  margin: 5px 5px 0 0;
}

blockquote span { 
  clear: both; display: block; 
  margin: 7px 0 0 20px; 
  font-size: 14px; line-height: 16px; font-style: italic;
}

blockquote span:before { 
  position: absolute; z-index: 1; 
  margin: 0 0 0 -18px;
  content: "—";
}

/* -------------------[ Breaks ]------------------- */

hr { 
  clear: both; 
  width: 100%; height: 0px; margin: 25px 0 30px 0; padding: 0 0 1px 0; 
  border: none;
  background-color: #3778bc; 
}

/* -------------------[ Button ]------------------- */

.button { 
  clear: both; display: inline-block;
  width: auto; margin: 0 0 15px 0; padding: 15px 25px; 
  border: 1px solid #3778bc;
  background-color: #3778bc;
  font-size: 15px; line-height: 15px; font-weight: 700; text-transform: uppercase; text-align: center;
}

a.button { 
  color: #FFF;
}

a.button:hover { 
  background-color: #FFF;
  color: #000;
}

/* -------------------[ Lists ]------------------- */

#content ul,
#content ol { 
  margin: 0 0 10px 30px; padding: 0;
}

#content ul li,
#content ol li { 
  margin: 0; padding: 0 0 3px 0;
  list-style-position: outside; 
}

#content ul li {
  list-style: disc; 
}

#content ol li { 
  list-style-type: decimal; 
}

/* -------------------[ Images ]------------------- */

img.image-left {
  float: left; 
  width: 100%; max-width: 300px; height: auto; margin: 0 15px 10px 0; 
}

img.image-right {
  float: right; 
  width: 100%; max-width: 300px; height: auto; margin: 0 0 15px 10px; 
}

img.image-single { 
  clear: both; 
  width: 100%; max-width: 400px; height: auto; margin-bottom: -10px; padding: 0; 
}

body.page-id-413 #content img {
  width: auto; max-width: 100%; height: auto;
}

.image-2-column,
.image-3-column { 
  clear: both; display: inline-block; 
  width: 100%; 
}

.image-2-column img { 
  float: left; position: relative; 
  width: 48%; height: auto; margin: 0; padding: 0 2% 2% 0;
}

.image-3-column img { 
  float: left; position: relative; 
  width: 31%; height: auto; margin: 0; padding: 0 2% 2% 0;
}

.image-2-column br,
.image-3-column br { 
  display: none;
}

.image-2-column-caption { 
  clear: both; display: inline-block; 
  width: 100%; 
  text-align: center; 
}

.image-2-column-caption .image-caption-left,
.image-2-column-caption .image-caption-right { 
  float: left; position: relative; 
  width: 48%; height: auto; margin: 0 2% 2% 0; padding: 0;
}

.image-2-column-caption .image-caption-left img,
.image-2-column-caption .image-caption-right img { 
  float: left; position: relative; 
  width: 100%; height: auto; margin: 0 0 5px 0; padding: 0;
}

img.image-border { 
  margin-bottom: 50px; 
  border: 1px solid #000;
}

img.image-contain {
  width: 100%; max-width: 100%; height: auto;
}

#content img.alignnone {
  width: auto; max-width: 100%; height: auto;
}

/* -------------------[ Video ]------------------- */

.video-left { 
  float: left;
}

.video-right { 
  float: right;
}

.video-left,
.video-right {
  position: relative; 
  width: 48%; height: 0; margin-bottom: 40px; padding-top: 30px; padding-bottom: 28.25%;
}

.video-full {
  position: relative; 
  width: 90%; height: 0; margin-bottom: 40px; padding-top: 30px; padding-bottom: 48.25%;
}
 
.video-left iframe,
.video-right iframe,
.video-full iframe {
  position: absolute; top: 0; left: 0; 
  width: 100%; height: 100%;
}

.video-left div,
.video-right div,
.video-full div {
  position: absolute; bottom: -25px; 
  width: 100%; 
  font-size: 14px; line-height: 16px; text-align: center; 
}

.video-center {
  margin-left: auto; margin-right: auto;
}






/* ====================================================================
   Header
   ==================================================================== */

/* -------------------[ Logo ]------------------- */

.logo-home img { 
  width: 100%; height: auto; margin: 10px 0 30px 0; 
}


.logo img { 
  float: left; 
  width: 500px; height: auto; margin: 5px 0 0 0; 
}

/* -------------------[ Nav ]------------------- */

.nav-header {
  clear: both; position: relative; top: -25px; left: 120px; 
  width: 700px; 
}

.nav-header ul { 
}

.nav-header li {
  display: inline-block; 
}

.nav-header a {
  margin: 0; padding: 0; 
  color: #000; font-family: 'Muli'; font-size: 15px; line-height: 35px; font-weight: 700; text-transform: uppercase; text-decoration: none; 
}

.nav-header a:hover, 
.nav-header li.current_page_item a,
.nav-header li.current-menu-item a,
.nav-header li.current-menu-parent a, 
.nav-header li.current-menu-ancestor a,
.nav-header li.current-category-ancestor a,
body.menu-item-blog li.menu-item-blog a { 
  color: #3778bc; 
}

.nav-header .nav-line { 
  float: right; position: relative; top: 0px; 
  padding: 0 7px 0 10px; 
  color: #d12428; font-size: 13px; line-height: 32px; 
}

.nav-header #menu-item-27 .nav-line,
.nav-header #menu-item-32 .nav-line,
.nav-header #menu-item-603 .nav-line { 
  display: none;
}









/* ====================================================================
   Home
   ==================================================================== */

/* -------------------[ Slideshow ]------------------- */

.home-slideshow { 
  clear: both; float: left; overflow: hidden; 
  width: 65%; max-width: 620px; height: 425px; 
}

.metaslider .caption-wrap {
  top: 90% !important; 
  background: #FFF !important; 
  opacity: 1 !important; 
  color: #000 !important; text-align: center !important; 
}

.metaslider .nivo-caption {
  margin-top: 7px !important;
}

.metaslider-35 .theme-default .nivo-controlNav a {
  margin-left: 6px !important; margin-right: 6px !important;
}

/* -------------------[ Boxes ]------------------- */

.home-nav { 
  float: right; 
  width: 40%; max-width: 340px; 
}

.home-nav a { 
  clear: both; display: block; 
  width: 100%; height: 30px; margin: 0 0 7px 0; 
  background-color: #ffde00; 
  color: #000; font-family: 'Muli'; font-size: 18px; line-height: 30px; font-weight: 700; letter-spacing: 0; text-transform: uppercase; text-indent: 15px; 
}

.home-nav a:hover { 
  background-color: #3778bc; 
  color: #FFF;
}

/* -------------------[ Bottom ]------------------- */

.home-cta { 
  display: block; 
  width: 96%; margin: 0 0 30px 0; padding: 25px 2%; 
  background-color: #3778bc;
  border: 1px solid #3778bc;
  text-align: center; 
}

.home-cta:hover { 
  background-color: #FFF !important;
  cursor: pointer;
}

.home-cta a { 
  color: #FFF; font-family: 'Muli'; font-size: 22px; line-height: 36px; font-weight: 700 !important; letter-spacing: 0.03em; text-transform: uppercase; 
}

.home-cta:hover a { 
  color: #3778bc !important;
}







/* ====================================================================
   Footer
   ==================================================================== */

#footer { 
  margin: 50px 0 10px 0; 
  font-size: 12px; line-height: 25px; font-weight: 400; text-transform: uppercase; text-align: center; 
}

#footer a { 
  color: #000;
}

#footer a:hover { 
  color: #d12428;
}

#footer img { 
  width: 35px; height: auto; margin: 0 5px 10px 5px;
}

#footer img:hover { 
  opacity: 0.8;
}