/* Body Fonts */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display&display=swap');

/* Header Fonts 
@font-face {
    font-family: tattoo;
    src: url(tattoo.ttf);
}
@font-face {
    font-family: hugtophia;
    src: url(hugtophia.ttf);
}
*/
/* New Custom CSS */


/*----------------------- Preloader -----------------------*/
body.preloader-site {
    overflow: hidden;
}

.preloader-wrapper {
    height: 100%;
    width: 100%;
    text-align: center;
    background: #FFFAFC;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999999;
}

.preloader-wrapper .preloader {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 200px;
}


/* Desktop Nav */
.top-bar {
	position: fixed;
	top:0;
	right: 0;
	z-index: 1;
	padding: 15px 0px 0px 0px;
	background: #fff;
	height: 40px;
	color:#000;
	font-weight: 300;
	width:100%;
	text-align: right;
    font-family: 'Playfair Display', serif;
}
.top-bar-inner a {
	color: #fff;
	text-decoration: none;
}
@media (max-width: 700px) {
	.top-bar {
        padding: 6px;
		text-align: center;
        font-size: 1.2rem;
	}
}

/* Nav Desktop */
.nav-desktop {
	position: fixed;
	clear: both;
	z-index: 1;
	right:0;
	top:40px;
	float: right;
	height: auto;
	width: 100%;
	background-color: #fff;
	 box-shadow: 0 8px 6px -6px gray;
	text-align: center;
	text-transform: uppercase;
	color:#fff;

}
.nav-desktop li {
	display: inline-flex;
	vertical-align: middle;
	margin: 15px 8px 15px;
	font-size: 1.5rem;
	letter-spacing: 0.1em;
	font-weight:lighter;
	float:right;
}
.nav-desktop a {
	color:#000;
	text-transform: uppercase;
	text-decoration: none;
	font-family: 'Playfair Display', serif;
	font-weight: 800;
	/* text-shadow: 2px 4px 3px rgba(0,0,0,0.3); */
	letter-spacing: normal;
}
.nav-desktop a:hover {
	color:#062D56;
}
@media screen and (max-width: 1100px) {
 .nav-desktop {
		display: none;
	}
}
.dropdown {
	margin-top: 4px !important; 
	display: none;
	position: absolute;
	  width: auto;
	  background: #2a66aa;
	color: #fff !important;
	  top: 30px;
	z-index: 999999 !important;
	overflow: visible;
	box-shadow: 0 8px 6px -6px gray;
	text-align: left !important;
}
.dropdown a {
	color:#fff !important;
	text-align: left !important;
} 
.dropdown-btn:hover .dropdown {
	display: inline-block;
}
.dropdown li:focus {
	display: inline-block;
	float: left;
	text-align: left !important;
	width: 100%;
}

/* Sub Nav Desktop */
.sub-nav-desktop {
	position: fixed;
	clear: both;
	z-index: 1;
	right:0;
	top:90px;
	height: auto;
	width: 100%;
	background-color: #000;
	text-align: center;
	text-transform: uppercase;
	color:#fff;
}
.sub-nav-desktop ul {
    margin:0;
}
.sub-nav-desktop li {
	display: inline-flex;
	vertical-align: middle;
	margin: 1% 4%;
	font-size: 1.5rem;
	letter-spacing: 0.1em;
	font-weight:lighter;
}
.sub-nav-desktop a {
	color:#fff;
	text-transform: uppercase;
	text-decoration: none;
	font-family: 'Open Sans', sans-serif;
	font-weight: 800;
	/* text-shadow: 2px 4px 3px rgba(0,0,0,0.3); */
	letter-spacing: normal;
}
.sub-nav-desktop a:hover {
	color:#062D56;
}
@media screen and (max-width: 1100px) {
 .sub-nav-desktop {
		/*display: none;*/
        margin-top: 20px;
	}
}


/* Side Drawer */
.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 99999999;
    top: 0;
    right: 0;
    background-color: #000;
	font-family: 'Playfair Display', serif;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
}

.sidenav a {
    padding: 18px 18px 18px 32px;
    text-decoration: none;
	font-family: 'Playfair Display', serif;
    font-size: 3.0rem;
    color: #fff;
    display: block;
    transition: 0.3s;
}

.sidenav a:hover {
    color: #f1f1f1;
}

.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}

@media screen and (max-height: 1100px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 2.0rem;}
	.hamburger { float: right; }
}
@media screen and (min-width: 1100px) {
	.sidenav { display:none; }
	.sidenav a { display:none; }
	#mySidenav { display:none; }
	.hamburger { display:none; }
}

/* Slider */
.slider-size img {
	height: 30vh !important;
}


/* Header */
.intro {
	position: relative;
	z-index: 0;
	height: auto;
    padding-top: 100px;
}
.intro img {
	width:100%;
	text-align: center;
}
.intro h1 {
	margin: 0 auto;
    font-family: 'Playfair Display', serif;
    background:rgb(255, 255, 255, 0.7);
	text-align: center;
	color:#000;
	font-size: 4.0rem;
	font-weight: 300;
	letter-spacing: 1.0rem;
	padding: 20px;
}
.intro h1 span {
	font-size: 2.0rem;
}

.address {
	font-family: 'Open Sans', sans-serif;
	font-size: 1.8rem;
}
@media screen and (max-width: 800px) {
    .intro {
        padding-top: 200px;
    }
	.intro h1 {
		font-size: 3.0rem;
		letter-spacing: 0.8rem;
		padding: 20px;
	}
	.address {
		font-size: 1.8rem;
	}
}

/* Flex Sections */
.flex-container {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: space-evenly;
    background: #DFD9C1;
}
.flex-item {
    width: 48%;
    height: auto;
    min-width: 300px;
    min-height: 400px;
    padding: 1%;
    overflow: visible;
    color: #000;
}
.flex-item h2 {
    text-decoration: underline;
}
.flex-container-small {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: space-evenly;
    background: none;
}
.flex-item-small {
    width: 23%;
    height: auto;
    min-width: 300px;
    min-height: 400px;
    padding: 1%;
    overflow: visible;
    color: #000;
}
.flex-item-small h2 {
    color:#000;
}
/*Footer*/
h3{
	color: #000;
	font-size: 30px;
	margin-top: 20px;
	text-align: center;
}


/* Photo Gallery */
.gallery {
  float: left;
	margin: 2%;
	width: 23%;
}
.gallery-img {
	float: left;
	width: auto;
	margin: 3px;
}

@media screen and (max-width: 800px) {
	.gallery {
		clear: both;
		margin: 0 auto;
		width: 95%;
	}
	.gallery-img {
		clear: both;
		width: 90%;
		margin: 0 auto;
	}
}


/* Logo */
.logo {
	position: fixed;
	left: 0px;
	top:0px;
	margin: 0.3%;
	z-index: 3;
}
.logo img {
	z-index: 3;
	width: 200px;
}

/* Larger than mobile */
@media (max-width: 700px) {
	.logo {
		position: fixed;
		left: 0px;
		top:25px;
		margin: 1%;
		width: 160px;
		text-align: left;
		z-index: 2;
        background: #fff;
	}
	.logo img {
		width: 180px;
	}
}


/* Circles */

.circle {
  -webkit-border-radius: 100%;
  -webkit-background-clip: padding-box;
  -moz-border-radius: 100%;
  -moz-background-clip: padding;
  border-radius: 100%;
  background-clip: padding-box;
  text-align: center;
  display: block;
  height: 0;
  width: 100%;
  padding: 50% 0;
  background: none;
	box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
}

.circle h2 {
	font-size: 2.2rem;
	text-shadow: 0px 4px 3px rgba(255,255,255,0.4),
             0px 8px 13px rgba(255,255,255,0.1),
             0px 18px 23px rgba(255,255,255,0.1);
}

/* Back to Top BTN */
#btnBackToTop {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: #d22333; /* Set a background color */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 5px; /* Some padding */
  border-radius: 5px; /* Rounded corners */
  font-size: 2.0rem; /* Increase font size */
}

#btnBackToTop:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}

/* Menu */

.menu-cat-btns li {
	list-style-type: none;
	display: inline-block;
	padding: 5px 12px;
}
.menu-cat-btns a {
	text-decoration: none;
}

.menu-container {
  padding: 1%;
  max-width: 100%;
  margin: 0 auto;
  height: auto;
	overflow: auto;
  display: flex;
  flex-flow: wrap; /* Shorthand – you could use ‘flex-direction: column’ and ‘flex-wrap: wrap’ instead */
  justify-content: flex-start;
  align-items: flex-start;
}
.child-menu-container {
  height: auto;
  width: 29%;
  margin: 1%;
  padding: 1%;
}
@media screen and (max-width: 870px) {
	.child-menu-container {
	  height: auto;
	  width: 100%;
	  margin: 0;
	  padding: 1%;
	}
}
.menu-btns a {
	color:#7B181D;
	font-weight: 700;
	padding-right: 20px;
}
.product-li {
	display:inline-block;
	vertical-align:text-top;
	padding: 0 40px 0 40px;
}
.product {
	-webkit-font-smoothing: antialiased;
	line-height:normal;
	padding:20px 0px;
	font-size:1.3rem;
	font-weight:300;
}
.product_category {
	font-weight:blod;
	color:#7B181D;
	-webkit-font-smoothing: antialiased;
	font-size:1.2rem;
}
.product_photo {
	width: 85px;
	height: 85px;
	float: left;
	margin: 15px 8px;
}
.product_title {
	font-weight:800;
	color:#FCE794;
	-webkit-font-smoothing: antialiased;
	font-size:1.7rem;
	text-transform: uppercase;
}
.product_price {
	color:#898989;
	font-size:1.5rem;
	font-weight: 600;
	-webkit-font-smoothing: antialiased;
}
.product_description {
	clear:both;
	padding:4px;
	font-size:0.7rem;
	-webkit-font-smoothing: antialiased;
}


/* Testimonials */
.testimonial {
	width: 60%;
	margin: 0 auto;
	clear: both;
	text-align: left;
	border-bottom: #ccc 2px solid;
	padding: 20px 0px 20px 0px;
}



.circular {
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	border:#7B181D 4px solid;
	 margin: auto;
	width: 140px;
}
.circular img {
	height:40px;
	width:40px;
	border:#7B181D 4px solid;
	vertical-align: middle;
}

/* Row Styles */
.style2 {
	-webkit-clip-path: polygon(0 9%, 100% 0%, 100% 90%, 0 100%);
	clip-path: polygon(0 9%, 100% 0%, 100% 90%, 0 100%);
	background: #d1dc75 url(../images/bg-home-1.jpg) center no-repeat;
	background-size: cover;
	text-align: center;
	padding: 30px 0px;
	margin-bottom: 30px;
	height: 300px;
	line-height: 300px;
}

/* Big Text */
.big-text {
	font-size: 1.8rem;
	width: 100%;
	text-align: center;
	background: #ccc;
	padding: 10px 22px;
}


/* Elements */
/* Button 2 */
.btn {
	border: none;
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	background: none;
	cursor: pointer;
	padding: 25px 80px;
	display: inline-block;
	margin: 15px 30px;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
	outline: none;
	position: relative;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
.black {
	background-color: #000;
}

.btn:after {
	content: '';
	position: absolute;
	z-index: -1;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
.btn-2 {
	background: #7B181D;
	color: #fff;
	-webkit-transition: none;
	-moz-transition: none;
	transition: none;
}

/* Button 2a */
.btn-2a {
	border-radius: 0 0 5px 5px;
}

.btn-2a:hover {
	box-shadow: 0 4px #ab3c3c;
	top: 2px;
}

.btn-2a:active {
	box-shadow: 0 0 #ab3c3c;
	top: 6px;
}
.btn-3 {
	background: #fff;
	color: #7B181D;
	border-radius: 20px;
	text-align: center;
	-webkit-transition: none;
	-moz-transition: none;
	transition: none;
}

.home-txt {
	clear: both;
	margin-top: 10px;
	padding-top: 50px;
	padding-bottom: 50px;
	font-family: 'Open Sans', sans-serif;
	width: 90%;
	margin: 0 auto;
	font-size: 1.8rem;
	line-height: 1.6;
	letter-spacing: 0;
	color:#000;
	font-weight:500;
	text-align:center;
}
.animated-sections {
	clear: both;
	margin-top: 10px;
	padding-top: 20px;
	padding-bottom: 20px;
	font-family: 'Open Sans', sans-serif;
	width: 90%;
	margin: 0 auto;
	font-size: 1.8rem;
	line-height: 1.6;
	letter-spacing: 0;
	color:#fff;
	font-weight:500;
	text-align:center;
}
.areas-of-practice a {
	color:#7B181D;
}

/* Reviews */
.review-citation {
	color:#a1a046;
}

/* Back to Top BTN */
#myBtn {
    display: none; /* Hidden by default */
    position: fixed; /* Fixed/sticky position */
    bottom: 20px; /* Place the button at the bottom of the page */
    right: 30px; /* Place the button 30px from the right */
    z-index: 99; /* Make sure it does not overlap */
    border: none; /* Remove borders */
    outline: none; /* Remove outline */
    color: #a1a046; /* Text color */
    cursor: pointer; /* Add a mouse pointer on hover */
    padding: 10px; /* Some padding */
    font-size: 4.0rem; /* Increase font size */
	 background-color:transparent;
}

#myBtn:hover {
    color: #555; /* Add a dark-grey background on hover */
}



/* Dark Button */
.dark-button {
	width: 300px;
	background: #000;
	margin: 0 auto;
	color:#fff;
	font-size: 2.0rem;
	padding: 15px 30px;
	text-transform: uppercase;
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	text-align: center;
	border-radius: 20px;
	text-decoration: none;
}
@media (max-width: 400px) {
	.dark-button {
        width: 200px;
        background: #000;
        margin: 0 auto;
        color:#fff;
        font-size: 1.0rem;
        padding: 15px 30px;
        text-transform: uppercase;
        font-family: 'Open Sans', sans-serif;
        font-weight: 700;
        text-align: center;
        border-radius: 20px;
        text-decoration: none;
    }
}

/* Footer */
footer {
	clear: both;
	background:#f2ebd1;
	color:#000;
	text-align: center;
	padding: 0px 0px 20px 0px;
	width: 100%;
	overflow: hidden;
}
footer a {
    color:#d22333;
}
.footer-left {
	float: left;
	width: 40%;
	padding: 3% 1%;
	text-align: left;
}
.footer-right {
	float: right;
	width: 47%;
	padding: 1%;
	text-align: right;
}
@media (max-width: 700px) {
	.footer-left {
		clear: both;
		width: 100%;
		padding: 1%;
		text-align: center;
	}
	.footer-right {
		clear: both;
		width: 100%;
		padding: 1%;
		text-align: center;
	}
}


/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container {
  position: relative;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box; }
.column,
.columns {
  width: 100%;
  float: left;
  box-sizing: border-box; }

/* For devices larger than 400px */
@media (min-width: 400px) {
  .container {
    width: 85%;
    padding: 0; }
}

/* For devices larger than 550px */
@media (min-width: 550px) {
  .container {
    width: 80%; }
  .column,
  .columns {
    margin-left: 4%; }
  .column:first-child,
  .columns:first-child {
    margin-left: 0; }

  .one.column,
  .one.columns                    { width: 4.66666666667%; }
  .two.columns                    { width: 13.3333333333%; }
  .three.columns                  { width: 22%;            }
  .four.columns                   { width: 30.6666666667%; }
  .five.columns                   { width: 39.3333333333%; }
  .six.columns                    { width: 48%;            }
  .seven.columns                  { width: 56.6666666667%; }
  .eight.columns                  { width: 65.3333333333%; }
  .nine.columns                   { width: 74.0%;          }
  .ten.columns                    { width: 82.6666666667%; }
  .eleven.columns                 { width: 91.3333333333%; }
  .twelve.columns                 { width: 100%; margin-left: 0; }

  .one-third.column               { width: 30.6666666667%; }
  .two-thirds.column              { width: 65.3333333333%; }

  .one-half.column                { width: 48%; }

  /* Offsets */
  .offset-by-one.column,
  .offset-by-one.columns          { margin-left: 8.66666666667%; }
  .offset-by-two.column,
  .offset-by-two.columns          { margin-left: 17.3333333333%; }
  .offset-by-three.column,
  .offset-by-three.columns        { margin-left: 26%;            }
  .offset-by-four.column,
  .offset-by-four.columns         { margin-left: 34.6666666667%; }
  .offset-by-five.column,
  .offset-by-five.columns         { margin-left: 43.3333333333%; }
  .offset-by-six.column,
  .offset-by-six.columns          { margin-left: 52%;            }
  .offset-by-seven.column,
  .offset-by-seven.columns        { margin-left: 60.6666666667%; }
  .offset-by-eight.column,
  .offset-by-eight.columns        { margin-left: 69.3333333333%; }
  .offset-by-nine.column,
  .offset-by-nine.columns         { margin-left: 78.0%;          }
  .offset-by-ten.column,
  .offset-by-ten.columns          { margin-left: 86.6666666667%; }
  .offset-by-eleven.column,
  .offset-by-eleven.columns       { margin-left: 95.3333333333%; }

  .offset-by-one-third.column,
  .offset-by-one-third.columns    { margin-left: 34.6666666667%; }
  .offset-by-two-thirds.column,
  .offset-by-two-thirds.columns   { margin-left: 69.3333333333%; }

  .offset-by-one-half.column,
  .offset-by-one-half.columns     { margin-left: 52%; }

}


/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
  font-size: 62.5%;
	overflow-x: hidden !important;
}
body {
	 overflow-x: hidden !important;
     overflow-y: auto;
    width:100%;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
  font-size: 1.5em; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.6;
  font-weight: 500;
  font-family: 'Open Sans', sans-serif;
  color: #000;
	background: #fff;
	background-size: cover;
}
img {
	max-width: 100%;
}
@media screen and (max-width: 800px) {
    body {
        background: #fff;
    }
}

/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 2rem;
  font-weight: 300;
	font-family: 'Playfair Display', serif;
	letter-spacing: 2;
}
h1 { text-transform: uppercase; font-size: 4.0rem; line-height: 1.2;  letter-spacing: -.1rem; color: #000; }
h2 { font-size: 3.6rem; line-height: 1.25; letter-spacing: -.1rem; color: #000; padding-top: 30px; }
h3 { font-size: 2.4rem; line-height: 1.3;  letter-spacing: -.1rem; color:#062D56; }
h4 { font-size: 2.4rem; line-height: 1.35; letter-spacing: -.08rem; }
h5 { font-size: 1.8rem; line-height: 1.5;  letter-spacing: -.05rem; }
h6 { font-size: 1.5rem; line-height: 1.6;  letter-spacing: 0; }

/* Larger than phablet */
@media (min-width: 550px) {
  h1 { font-size: 5.0rem; }
  h2 { font-size: 4.5rem; }
  h3 { font-size: 3.4rem; }
  h4 { font-size: 3.0rem; }
  h5 { font-size: 2.4rem; }
  h6 { font-size: 1.5rem; }
}

p {
  margin-top: 0; }


/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
  color: #FCE794; }
a:hover {
  color: #062D56; }


/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  display: inline-block;
  height: 38px;
  padding: 0 30px;
  color: #fff;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 38px;
  letter-spacing: .1rem;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  border-radius: 4px;
  border: 1px solid #bbb;
  cursor: pointer;
  box-sizing: border-box; }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
  color: #fff;
  border-color: #fff;
  outline: 0; }
.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
  color: #FFF;
  background-color: #000;
  border-color: #fff;
margin-bottom: 5px;}
.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
  color: #FFF;
  background-color: #000;
  border-color: #fff; }


/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
  height: 38px;
  padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
  background-color: #fff;
	color: #000;
  border: 1px solid #D1D1D1;
  border-radius: 4px;
  box-shadow: none;
  box-sizing: border-box; }
/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none; }
textarea {
  min-height: 150px;
  padding-top: 6px;
  padding-bottom: 6px; }
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
  border: 1px solid red;
  outline: 0; }
label,
legend {
  display: block;
  margin-bottom: .5rem;
  font-weight: 600; }
fieldset {
  padding: 0;
  border-width: 0; }
input[type="checkbox"],
input[type="radio"] {
  display: inline; }
label > .label-body {
  display: inline-block;
  margin-left: .5rem;
  font-weight: normal; }


/* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
ul {
  list-style: circle inside; }
ol {
  list-style: decimal inside; }
ol, ul {
  padding-left: 0;
  margin-top: 0; }
ul ul,
ul ol,
ol ol,
ol ul {
  margin: 1.5rem 0 1.5rem 3rem;
  font-size: 90%; }
li {
  margin-bottom: 1rem; }


/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
  padding: .2rem .5rem;
  margin: 0 .2rem;
  font-size: 90%;
  white-space: nowrap;
  background: #F1F1F1;
  border: 1px solid #E1E1E1;
  border-radius: 4px; }
pre > code {
  display: block;
  padding: 1rem 1.5rem;
  white-space: pre; }


/* Tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
th,
td {
  padding: 12px 15px;
  text-align: left;
  border-bottom: 1px solid #E1E1E1; }
th:first-child,
td:first-child {
  padding-left: 0; }
th:last-child,
td:last-child {
  padding-right: 0; }


/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
button,
.button {
  margin-bottom: 1rem; }
input,
textarea,
select,
fieldset {
  margin-bottom: 1.5rem; }
pre,
blockquote,
dl,
figure,
table,
p,
ul,
ol,
form {
  margin-bottom: 2.5rem; }


/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
  width: 100%;
  box-sizing: border-box; }
.u-max-full-width {
  max-width: 100%;
  box-sizing: border-box; }
.u-pull-right {
  float: right; }
.u-pull-left {
  float: left; }


/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
  margin-top: 3rem;
  margin-bottom: 3.5rem;
  border-width: 0;
  border-top: 1px solid #E1E1E1; }


/* Clearing
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Self Clearing Goodness */
.container:after,
.row:after,
.u-cf {
  content: "";
  display: table;
  clear: both; }


/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/


/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}