/*
* Additonal Styles
* ------------------
* Please Put NON-SCSS styles in this file.  It will load last and
* remain untouched by the gulp build process
*/
/*
Additional styles added on 2017-07-26
--
Used in VFM system interface pages (login, signup, etc...)
*/

@media screen and (min-width: 783px){
  .admin-bar #pageNav{
    top: 32px;
  }
}

@media screen and (min-width: 750px) and (max-width: 782px){
  .admin-bar #pageNav{
    top: 46px;
  }
}

.orange-checkbox { display:inline-block; box-sizing:border-box; width:24px; height:24px; border: 1px solid #e4e4e4; box-shadow:0px 2px 4px #ccc; cursor:pointer; border-radius:4px; vertical-align:middle; }
.orange-checkbox.checked { background:transparent url("/dashboard/images/check-orange.png") no-repeat center center; }

.orange-checkbox + input + span { cursor:pointer; position:relative; top:2px; padding-left:12px; }



#login-container { font-weight:400; width:370px; margin:0 auto; padding:24px 0; max-width:96%; line-height:28px; }
#login-container > div:nth-child(1) { text-align:center; font-size:24pt; padding-bottom:40px; }
#login-container #email, #login-container #password { padding-left:6px;padding-right:6px;width:100%; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; }
#login-container input[type="checkbox"] { width:48px; }
#login-container input[type="submit"] { line-height:42px;float:right; background-color:#92d050; color:#fff; border:1px solid #92d050; border-radius:4px; padding:0px 20px; box-shadow:0px 2px 6px #ccc; cursor:pointer; }
#login-container > div:nth-child(3) { color:#f00; line-height:18px; margin-bottom:8px; text-align:center; }
#login-container > div:nth-child(4) { margin-bottom:8px; }
#login-container > div:nth-child(5) { margin-bottom:8px; }
#login-container > div:nth-child(6) { height:40px; line-height:40px; }
#login-container > div:nth-child(7) { text-align:center; font-size:10pt; margin-top:16px; }
#login-container > div:nth-child(8) { text-align:center; font-size:10pt; margin-top:-6px; margin-bottom:128px; }
#login-container > div:nth-child(8) { text-align:center; font-size:10pt; margin-top:-6px; margin-bottom:128px; }

#login-container input[type="checkbox"] { width:24px; height:24px; vertical-align:middle; opacity:0; position:absolute; line-height:24px; cursor:pointer; }
#login-container input[type="checkbox"] + label { font-weight:400; }
#login-container input[type="checkbox"] + label::before { content:" "; display:inline-block; box-sizing:border-box; width:24px; height:24px; border: 1px solid #e4e4e4; box-shadow:0px 2px 4px #ccc; cursor:pointer; border-radius:4px; vertical-align:middle; margin-right:8px; position:relative; top:-3px; }
#login-container input[type="checkbox"]:checked + label::before { background:transparent url("/dashboard/images/check-blue.png") no-repeat center center; }
#login-container input[type="checkbox"]:focus + label::before { border-color:#1880D7; outline:none; }
#login-container #email:focus, #login-container #password:focus { border-color:#1880D7; outline:none; }


.important-red {
  color: red;
  text-align: center;
}

a.important-close:active,
a.important-close:hover,
a.important-close:visited{
  color: blue;
}



#verify-container { font-weight:400; width:100%; margin:0 auto; padding:24px 0; max-width:96%; line-height:28px; }
#verify-container > div:nth-child(1) { text-align:center; font-size:24pt; padding-bottom:40px; }
#verify-container > div:nth-child(2) { color:#f00; line-height:18px; margin-bottom:8px; text-align:center; }
#verify-container > div:nth-child(3) { color:#333; line-height:18px; margin-bottom:8px; text-align:center; }






#expired-container { font-weight:400; width:400px; margin:0 auto; padding:24px 0; max-width:96%; line-height:28px; }
#expired-container > div:nth-child(1) { text-align:center; font-size:24pt; padding-bottom:24px; }
#expired-container > div:nth-child(2) { text-align:center; padding-bottom:16px; }
#expired-container > div:nth-child(3) { color:#f00; line-height:18px; margin-bottom:8px; text-align:center; }
#expired-container #password, #expired-container #cpassword { padding-left:6px;padding-right:6px;width:100%; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; }
#expired-container input[type="submit"] { line-height:42px;background-color:#92d050; color:#fff; border:1px solid #92d050; border-radius:4px; padding:0px 60px; box-shadow:0px 2px 6px #ccc; cursor:pointer; }
#expired-container > div:nth-child(7) { height:40px; line-height:40px; text-align:center; margin-top:36px; margin-bottom:128px; }

#expired-container #password:focus, #expired-container #cpassword:focus { border-color:#1880D7; outline:none; }

#expired-container > div:nth-child(5) { margin-bottom:8px; text-align:center; font-size:10pt; }
#password-strength { width:200px; height:16px; border:1px solid #e4e4e4; box-shadow:0px 2px 6px #ccc; display:inline-block; position:relative; border-radius:4px; vertical-align:middle; }
#password-strength > div { position:absolute; left:0; top:0; height:100%; width:0%; background-color:#00ff00; border-radius:4px; }
#password-strength > div { transition: width 250ms linear, background-color 250ms linear; }






#forgot-container { font-weight:400; width:400px; margin:0 auto; padding:24px 0; max-width:96%; line-height:28px; }
#forgot-container > div:nth-child(1) { text-align:center; font-size:24pt; padding-bottom:24px; }
#forgot-container > div:nth-child(2) { text-align:center; padding-bottom:18px; line-height:20px; }
#forgot-container > div:nth-child(3) { text-align:center; padding-bottom:8px; line-height:20px; color:#ff0000; }
#forgot-container #email { padding-left:6px;padding-right:6px;width:100%; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; }
#forgot-container input[type="submit"] { line-height:42px;background-color:#92d050; color:#fff; border:1px solid #92d050; border-radius:4px; padding:0px 60px; box-shadow:0px 2px 6px #ccc; cursor:pointer; }
#forgot-container > div:nth-child(5) { height:40px; line-height:40px; text-align:center; margin-top:36px; margin-bottom:128px; }

#forgot-container #email:focus { border-color:#1880D7; outline:none; }



#signup-container { font-weight:400; max-width:1000px; margin:0 auto; padding:24px 0; max-width:96%; line-height:28px; }
#signup-container > div:nth-child(1), #signup-container #errors2 { width:500px; max-width:92%; margin:0 auto 64px auto; color:#f00; }
#signup-container #errors2 { margin-top:32px; }
#signup-container > div:nth-child(2) { text-align:center; font-size:24pt; padding-bottom:24px; }
#signup-container > div:nth-child(3) { text-align:center; }
#signup-container > div:nth-child(3) > div { display:inline-block; width:280px; height:183px; margin:6px; border:1px solid #d8d8d8; box-shadow:0px 4px 8px #d8d8d8; box-sizing:border-box; cursor:pointer; position:relative; top:0px; transition:background-color 250ms, top 250ms, opacity 250ms; }
/*
edited 9/13 CB
to move opacity from entire div to non-overlayBox children
		*/
#signup-container > div:nth-child(3) > div.notselected > div:not(.overlayBox) { opacity:0.4; }
/*
added 9/13 CB
to change color of box shadow and border of .notselected
*/
#signup-container > div:nth-child(3) > div.notselected{  box-shadow:0px 4px 8px #e5e5e5!important; border-color:#e5e5e5;}
#signup-container > div:nth-child(3) > div.selected { background-color:#92d050; /*background-color:#FE9322;*/ color:#FFF; position:relative; top:-6px; }
#signup-container > div:nth-child(3) > div.selected > div:nth-child(2) { color:#FFF; }
#signup-container > div:nth-child(3) > div > div:nth-child(1) { font-weight:300; font-size:22pt; margin-top:26px; }
#signup-container > div:nth-child(3) > div > div:nth-child(2) { font-weight:700; font-size:40pt; /*color:#FE9322;*/ margin-top:20px; }
#signup-container > div:nth-child(3) > div > div:nth-child(3) { font-weight:400; font-size:12pt; margin-top:20px; }

#signup-container > div:nth-child(4) { text-align:center; font-size:24pt; padding-bottom:24px; margin-top:72px; }
#signup-container > div:nth-child(5) { text-align:center; padding-bottom:24px; }

#signup-container > div:nth-child(6) { text-align:center; font-size:24pt; padding-bottom:24px; margin-top:48px; }
#signup-container > div:nth-child(7) { text-align:center; }

#signup-container > div:nth-child(8) { text-align:center; }

#signup-billing, #signup-billing2 { display:none; }

#signup-container #first-name { padding-left:6px;padding-right:6px;width:370px; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; margin:9px; }
#signup-container #last-name { padding-left:6px;padding-right:6px;width:370px; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; margin:9px; }
#signup-container #email { padding-left:6px;padding-right:6px;width:241px; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; margin:9px; }
#signup-container #password { padding-left:6px;padding-right:6px;width:240px; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; margin:9px; }
#signup-container #cpassword { padding-left:6px;padding-right:6px;width:241px; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; margin:9px; }

#signup-container #bname { padding-left:6px;padding-right:6px;width:370px; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; margin:9px; }
#signup-container #phone { padding-left:6px;padding-right:6px;width:370px; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; margin:9px; }
#signup-container #address { padding-left:6px;padding-right:6px;width:370px; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; margin:9px; }
#signup-container #address2 { padding-left:6px;padding-right:6px;width:370px; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; margin:9px; }

#signup-container #country { padding-left:6px;padding-right:6px;padding:0 12px; width:252px; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; margin:9px; }
#signup-container #city { padding-left:6px;padding-right:6px;width:235px; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; margin:9px; }
#signup-container #state { padding:0 12px; width:77px; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; margin:9px; }
#signup-container #zip { padding-left:6px;padding-right:6px;width:141px; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; margin:9px; }
#signup-container .input { width:141px; height:48px; box-sizing:border-box; border:1px solid #e4e4e4; border-radius:4px; background-color:#fff; box-shadow:0px 2px 6px #ccc; margin:9px; display:inline-block; padding:0 12px; }

#signup-container input:focus, #signup-container select:focus { outline:none; }

#signup-container input[type="checkbox"] { width:24px; height:24px; vertical-align:middle; opacity:0; position:absolute; line-height:24px; cursor:pointer; }
#signup-container input[type="checkbox"] + label { font-weight:400; height:24px; line-height:24px; display:inline-block; }
#signup-container input[type="checkbox"] + label::before { content:" "; display:inline-block; box-sizing:border-box; width:24px; height:24px; border: 1px solid #e4e4e4; box-shadow:0px 2px 4px #ccc; cursor:pointer; border-radius:4px; vertical-align:middle; margin-right:8px; position:relative; top:-3px; }
#signup-container input[type="checkbox"]:checked + label::before { background:transparent url("/dashboard/images/check-blue.png") no-repeat center center; }
#signup-container input[type="checkbox"]:focus + label::before { border-color:#1880D7; outline:none; }

#signup-submit { margin-top:24px; }

#signup-container input[type="submit"] { line-height:42px; background-color:#0F72F6; color:#fff; border:1px solid #0F72F6; border-radius:4px; padding:0px 20px; box-shadow:0px 2px 6px #ccc; line-height:40px; margin-top:24px; }

#signup-cards { max-width:92%; width:370px; height:30px; background-size:contain; background-image:url("/dashboard/images/creditcards.png"); background-repeat:no-repeat; display:inline-block; margin-top:8px; }

@media (max-width:840px) {
	#signup-container input[type="text"], #signup-container input[type="password"], #signup-container select, #signup-container .input { width:92% !important; margin-left:4%; margin-right:4%; }
	#signup-container .input { margin-top:8px; margin-bottom:0px; }
}

/* WP Template-Signup */
#signup-plans > div {
  overflow-y: visible;
  position: relative; }
  #signup-plans > div .overlayBox {
    -webkit-transition: all .25s linear;
    transition: all .25s linear;
    position: absolute;
    left: 1rem;
    width: calc(100% - 2rem);
    background-color: #333333 !important;
    color: white !important;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.23), 0 10px 40px rgba(0, 0, 0, 0.19);
            box-shadow: 0 6px 12px rgba(0, 0, 0, 0.23), 0 10px 40px rgba(0, 0, 0, 0.19);
    text-align: center;
    margin: 1rem auto;
    opacity: 1;
    max-height: 0px;
    overflow: hidden; }
    #signup-plans > div .overlayBox table {
      margin: 1em auto;
      font-size: .75rem; }
      #signup-plans > div .overlayBox table td {
        line-height: 1rem; }
    @media (max-width: 991px) {
      #signup-plans > div .overlayBox {
        display: none !important; } }
  #signup-plans > div:hover .overlayBox {
    -webkit-transition: all .25s linear;
    transition: all .25s linear;
    -webkit-transition-delay: .75s;
            transition-delay: .75s;
    opacity: 1;
    max-height: 250px;
    overflow: hidden; }


#signup-testimonials-header { max-width:100%; width:900px; margin:24px auto 48px auto; text-align:center; }
#signup-testimonials-header > span:nth-child(2) { font-weight:700; white-space:nowrap; }
#signup-testimonials-header > span:nth-child(1),
#signup-testimonials-header > span:nth-child(3) { display:inline-block; height:1px; background-color:#c7c7c7; margin-right:16px; margin-left:16px; width:200px; vertical-align:middle; }
#signup-testimonials { margin:24px auto 96px auto; width:785px; max-width:100%; }
#signup-testimonials .photo { float:left; border-radius:50%; border:1px solid #e7e7e7; overflow:hidden; width:128px; height:128px; }
#signup-testimonials .quote { float:left; width:655px; max-width:100%; font-weight:300; position:relative; }
#signup-testimonials .quote:after { content:"“"; position:absolute; top:24px; left:16px; font-size:48pt; color:#d7d7d7; }
#signup-testimonials .photo > img { width:100%; height:auto; }
#signup-testimonials .quoteInfo { text-align:right; width:100%; display:block; }
#signup-testimonials .quoteInfo > span { display:block; }
#signup-testimonials .quoteInfo > span:nth-child(1) { font-weight:700; }
#signup-testimonials .quoteInfo > span:nth-child(2) { font-style:italic; font-weight:300; }

@media (max-width:780px) {
	#signup-testimonials-header > span:nth-child(1),
	#signup-testimonials-header > span:nth-child(3) { display:none; }
	#signup-testimonials .photo { float:none; margin:0 auto; }
	#signup-testimonials .quote { float:none; margin:0 auto; }
	#signup-testimonials .quote:after { top:8px; }
	#signup-testimonials .quoteInfo { margin-right:32px; width:calc(100% - 32px); }
}

/*
#signup-testimonials > .testimonial >
#signup-testimonials > .testimonial >
*/

.sectionRoundTop.sectionRoundTopGuide{
  min-height: 0;
  padding-bottom: 4rem;

  -webkit-transform: none;
  transform: none;

  background: url("../img/guide-circle.png") top center / 190% no-repeat;
}

.header-guide .bgImage .image{
  background-image: url("../img/guide-head.jpg");
}

#header.header-guide{
  max-height: 340px;
}

body.page-blue .header-guide .bgImage .overlay{
  filter: none;
  opacity: 1;
  background: rgba(52, 126, 211, 0.92);
}

#header.header-guide .content .text h2{
  font-weight: 500;
  font-size: 2.5rem;
  line-height: 1.175;
  text-align: center;

  width: auto;
}

.guide-head-title {
  position: absolute;
  left: 0;
  bottom: 100px;

  color: #fff;
  font-size: 20px;
  text-align: center;

  width: 100%;
}

.guide-container{
  position: relative;

  max-width: 810px;
  margin: 0 auto;
  padding: 0 1em;

  z-index: 1;
}

.guide-nav{
  font-size: 0;
}

.guide-nav-static{
  margin: -133px -5px -5px;
  padding-bottom: 60px;
}

.guide-nav-item,
.more-nav{
  display: inline-block;

  padding: 5px;
}

.guide-nav-link,
.guide-nav-link__number,
.more-nav__btn{
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.guide-nav-link,
.more-nav__btn{
  color: #333;
  font-size: 12px;
  line-height: 1.5;
  text-decoration: none;

  border-radius: 30px;
  box-shadow: 2px 2px 8px rgba(27, 30, 64, 0.1);
  background-color: #fff;

  transition: all 0.15s ease-in-out;
}

.guide-nav-link{
  padding: 4px 16px 4px 4px;
}

@media screen and (min-width: 1025px){
  .guide-nav-link:hover,
  .more-nav__btn:hover{
    color: #fff;
    background-color: #92d050;
  }
  
  .more-nav__btn:hover:after {
	opacity: 0;
	-webkit-transform: rotate(0);
	transform: rotate(0);
  }
  
  .more-nav__btn:hover:after{
    opacity: 0;
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }

  .more-nav__btn:hover:before{
    opacity: 1;
  }
}

.guide-nav-link__number{
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;

  color: #fff;
  font-size: 14px;

  height: 28px;
  min-width: 28px;
  max-width: 28px;
  margin-right: 8px;

  border-radius: 50%;
  background-color: #92d050;

  transition: all 0.15s ease-in-out;
}

@media screen and (min-width: 1025px) {
  .guide-nav-link:hover .guide-nav-link__number {
    color: #92d050;
    background-color: #fff;
  }
}

.guide-fixed-nav{
  position: fixed;
  left: 0;
  top: 52px;

  padding: 15px;

  width: 100%;

  background-color: rgba(251, 251, 253, 0.93);
  box-sizing: border-box;

  transition: transform 0.25s ease-in-out;

  z-index: 10;

  transform: translateY(-150px);
}

.guide-fixed-nav.fixed{
  transform: none;
}

.admin-bar .guide-fixed-nav{
  top: 84px;
}

@media screen and (max-width: 782px) {
  .admin-bar .guide-fixed-nav {
    top: 98px;
  }
}

@media screen and (max-width: 749px) {
  .admin-bar .guide-fixed-nav {
    top: 94px;
  }
}

@media screen and (max-width: 700px) {
  .admin-bar .guide-fixed-nav {
    top: 110px;
  }
}

.guide-fixed-nav-inside{
  position: relative;

  width: 100%;
  max-width: 1332px;

  padding: 0 16px;
  margin: 0 auto;

  box-sizing: border-box;
}

.guide-fixed-nav .guide-nav{
  margin: -5px 0;
}

.guide-nav-inside{
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

.guide-nav-inside .guide-nav-item{
  min-width: 145px;
  box-sizing: border-box;
}

.guide-fixed-nav .guide-nav-link{
  position: relative;

  max-width: 250px;

  box-sizing: border-box;
}

.guide-fixed-nav .guide-nav-link:before,
.guide-fixed-nav .guide-nav-link:after{
  content: "";

  position: absolute;

  border-radius: 30px;

  z-index: -1;

  opacity: 0;

  transition: opacity 0.15s ease-in-out;
}

.guide-fixed-nav .guide-nav-link:before{
  left: -3px;
  top: -3px;
  right: -3px;
  bottom: -3px;

  background-color: rgba(146, 208, 80, 0.3);
}

.guide-fixed-nav .guide-nav-link:after{
  left: -4px;
  top: -4px;
  right: -4px;
  bottom: -4px;

  border: 1px solid #edf0f9;
}

.guide-fixed-nav .guide-nav-link__label{
  white-space: nowrap;
  text-overflow: ellipsis;

  overflow: hidden;
}

.guide-fixed-nav .guide-nav-link.active:before,
.guide-fixed-nav .guide-nav-link.active:after{
  opacity: 1;
}

.guide-nav-inside .guide-nav-item.short-link{
  min-width: 0;
}

.more-nav{
  position: relative;
}

@media screen and (min-width: 750px) {
  .more-nav__btn{
    position: relative;

    font-weight: 500;

    width: 100%;
    height: 36px;

    padding: 4px 16px;

    box-sizing: border-box;

    cursor: pointer;
  }

  .more-nav__btn:before,
  .more-nav__btn:after{
    content: "";

    position: absolute;
    right: 19px;
    top: 15px;

    width: 9px;
    height: 5px;

    transition: all 0.15s ease-in-out;

    -webkit-transform-origin: center center;
    transform-origin: center center;
  }

  .more-nav__btn:before{
    opacity: 0;

    background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOSIgaGVpZ2h0PSI1IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNLjE0NiA0Ljg1NGEuNS41IDAgMDAuNzA4IDBMNC41IDEuMjA3bDMuNjQ2IDMuNjQ3YS41LjUgMCAxMC43MDgtLjcwOGwtNC00YS41LjUgMCAwMC0uNzA4IDBsLTQgNGEuNS41IDAgMDAwIC43MDh6IiBmaWxsPSIjZmZmIi8+PC9zdmc+") center center no-repeat;
  }

  .more-nav__btn:after{
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);

    background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOSIgaGVpZ2h0PSI1IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNLjE0NiA0Ljg1NGEuNS41IDAgMDAuNzA4IDBMNC41IDEuMjA3bDMuNjQ2IDMuNjQ3YS41LjUgMCAxMC43MDgtLjcwOGwtNC00YS41LjUgMCAwMC0uNzA4IDBsLTQgNGEuNS41IDAgMDAwIC43MDh6IiBmaWxsPSIjMzMzIi8+PC9zdmc+") center center no-repeat;
  }

  .more-nav__btn:hover:after{
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }

  .more-nav__body{
    position: absolute;
    top: 100%;
    right: 5px;

    padding: 5px;

    border-radius: 10px;
    box-shadow: 2px 2px 8px rgba(60, 63, 94, 0.14);
    background-color: #f7f8fd;

    transform: translateY(5px);
    opacity: 0;
    visibility: hidden;

    transition: all 0.15s ease-in-out;
  }

  .guide-fixed-nav.fixed .more-nav:hover .more-nav__body{
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
  }
}

.page-progress-container {
  position: absolute;
  left: 21px;
  top: -10px;

  width: calc(100% - 42px);

  border-radius: 2px;
  overflow: hidden;

  z-index: 10;
}

.page-progress {
  width: 100%;

  border-top: 3px solid #0f72f5;

  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
  transition: transform .05s ease-in-out;

  border-radius: 2px;
}

.guide-text{
  line-height: 1.5;
}

.guide-text p{
  margin: 1em 0 0;
}

.guide-text p:first-child{
  margin: 0;
}

.guide-text a{
  color: #065cbf;
}

.guide-text a:hover{
  text-decoration: none;
}

.guide-section-inside{
  padding: 60px 0;
}

.guide-section:nth-child(2n+1){
  background-color: #f9f9fb;
}

.chapter-number{
  color: #838390;
  font-size: 16px;
  line-height: 1.1875;
  text-align: center;

  padding-bottom: 15px;
}

.guide-section .guide-title{
  color: #333;
  font-weight: 300;
  font-size: 36px;
  line-height: 1.5;
  text-align: center;

  margin: 0 0 45px;
}

.guide-section .guide-title:after{
  content: "";

  display: block;

  width: 60px;
  height: 4px;

  margin: 20px auto 0;

  border-radius: 1px;
  background-color: #92d050;
}

.guide-title strong{
  display: block;
  font-weight: 500;
}

.guide-text ul{
  margin: 1.8em 0 0;
  padding: 0;
}

.guide-text ul div{
  display: block;

  font-weight: 500;
  font-size: 18px;
}

.guide-text ul li{
  position: relative;
  list-style: none;

  margin: 30px 0 0;
  padding: 0 0 0 28px;
}

.guide-text ul li:first-child{
  margin: 0;
}

.guide-text ul li:before{
  content: "";

  position: absolute;
  left: 0;
  top: 5px;

  width: 16px;
  height: 16px;

  border-radius: 50%;
  border: 4px solid #92d050;
  box-sizing: border-box;
}

.guide-text ul li p{
  margin-top: 0.7em;
}

.guide-section{
  position: relative;

  z-index: 1;
}

.guide-section-chapt1{
  background: url("../img/guide-chapt-1.png") center 110% / 1920px no-repeat #fff;
}

.guide-section-chapt2{
  background: url("../img/guide-chapt-2.jpg") center center / cover no-repeat;
}

.guide-section-chapt2-inside{
  background-color: rgba(252, 252, 254, 0.98);
}

.guide-section-chapt3{
  background: url("../img/guide-chapt-3.png") center center / 2440px no-repeat #fff;
}

.guide-section-chapt4{
  background: url("../img/guide-chapt-4.jpg") center center / cover no-repeat;
}

.guide-section-chapt4-inside{
  background-color: rgba(252, 252, 254, 0.9);
}

.guide-section-chapt5{
  background: url("../img/guide-chapt-5.png") center center / 2000px no-repeat #fff;
}

.guide-section-chapt6{
  background: url("../img/guide-chapt-6.jpg") center center / cover no-repeat;
}

.guide-section-chapt6-inside{
  background-color: rgba(252, 252, 254, 0.98);
}

.guide-nav-title{
  display: none;
}

@media screen and (min-width: 750px){
  #pageNav.fixed .logo {
    min-width: 125px;
  }
}


@media screen and (max-width: 1024px){
  .guide-nav-static {
    margin: -85px -5px -5px;
  }

  #pageNav .flexRow{
    align-items: center;
  }
}

@media screen and (max-width: 749px){
  .admin-bar #pageNav {
    position: fixed;
    top: 46px;
  }

  #wpadminbar{
    position: fixed;
  }

  #pageNav .mobileNavbar{
    box-shadow: none;
  }

  .guide-head-title,
  .guide-nav.guide-nav-static{
    display: none;
  }

  .guide-fixed-nav,
  .guide-fixed-nav-inside{
    padding: 0;
  }

  #header.header-guide{
    max-height: none;
    min-height: 0;

    padding: 128px 0 85px;
  }

  .sectionRoundTopGuide{
    padding-top: 50px;
  }

  #pageNav .mobileNavbar .leftToggle,
  #pageNav .mobileNavbar .rightToggle{
    max-width: 54px;
    min-width: 54px;
  }

  .svg-inline--fa.fa-w-14{
    width: 16px;
    height: 16px;
  }

  .guide-menu-btn{
    width: 32px;
    height: 32px;

    border-radius: 4px;
    background: url("../img/guide-icon.svg") center center no-repeat;

    transition: background-color 0.15s ease-in-out;
  }

  .guide-menu-btn:active{
    background-color: #2459c5;
  }

  .guide-fixed-nav{
    top: 48px;

    -webkit-transform: none;
    transform: none;

    background-color: transparent;

    z-index: 30;
  }

  .guide-fixed-nav.active .guide-nav{
    display: block;
  }

  .guide-fixed-nav .guide-nav{
    position: absolute;
    right: 0;
    top: 0;

    padding: 20px 10px;
    margin: 0;

    height: calc(100vh - 48px);

    overflow: auto;

    box-shadow: 0 0 10px rgba(60, 63, 94, 0.3);
    background-color: #f7f8fd;

    box-sizing: border-box;

    opacity: 0;
    -webkit-transform: translate3d(100%, 0px, 0px);
    transform: translate3d(100%, 0px, 0px);
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1), opacity 0s linear 0.25s;
  }

  .admin-bar .guide-fixed-nav .guide-nav{
    height: calc(100vh - 94px);
  }

  .guide-fixed-nav.active .guide-nav{
    opacity: 1;
    -webkit-transform: translate3d(0, 0px, 0px);
    transform: translate3d(0, 0px, 0px);
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1), opacity 0s linear 0s;
  }

  .guide-nav-title{
    position: relative;
    display: block;

    color: #333;
    font-weight: 400;
    font-size: 18px;

    margin: 2px 5px 15px 5px;
    padding-left: 35px;
  }

  .guide-nav-title__icon{
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -12px;

    width: 24px;
    height: 24px;

    border-radius: 50%;
    background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNSIgaGVpZ2h0PSI5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNLjE0Ni40MjdhLjQxOS40MTkgMCAwMDAgLjYzNmwzLjY0NyAzLjI4MUwuMTQ2IDcuNjI1YS40MTkuNDE5IDAgMDAwIC42MzcuNTQuNTQgMCAwMC43MDggMGw0LTMuNmEuNDE5LjQxOSAwIDAwMC0uNjM2bC00LTMuNmEuNTQuNTQgMCAwMC0uNzA4IDB6IiBmaWxsPSIjMzMzIi8+PC9zdmc+") center center no-repeat #fff;
  }

  .guide-fixed-nav .guide-nav-inside{
    display: block;
  }

  .guide-fixed-nav .guide-nav-inside .guide-nav-item{
    display: block;
  }

  .guide-nav-inside .guide-nav-item.short-link,
  .more-nav{
    width: auto!important;
  }

  .more-nav{
    padding: 0;
  }

  .more-nav__btn{
    display: none;
  }

  .guide-nav-link{
    display: -ms-inline-flexbox;
    display: -webkit-inline-flex;
    display: inline-flex;
  }

  .page-progress-container{
    top: 0;
    left: 0;

    width: 100%;

    background-color: #fff;
  }

  .page-progress{
    border-color: #92d050;
  }
}

@media screen and (max-width: 700px){
  .sectionRoundTopGuide:before{
    content: "";

    position: absolute;
    left: 0;
    bottom: 0;

    height: 90%;
    width: 100%;

    background-color: #fafafd;
  }

  #header.header-guide .content .text h2{
    font-size: 24px;
    max-width: 300px;
    margin: 0 auto;
  }

  .guide-section-inside {
    padding: 50px 0;
  }

  .guide-section .guide-title{
    font-size: 32px;
  }

  .guide-fixed-nav{
    top: 64px;
  }

  .guide-fixed-nav .guide-nav{
    height: calc(100vh - 64px);
  }

  .admin-bar .guide-fixed-nav .guide-nav{
    height: calc(100vh - 110px);
  }
}