/* All */
html, body {
	height: 100%;
}

main {
	min-height: 100%;
	height: auto;
	margin: 0 auto -183px;
	padding: 0 0 183px;
	overflow-x: clip;
}

main a:not(.post-link):not(.no-highlight) {
	color: #039be5 !important;
	font-weight: 500 !important;
}

main a:not(.no-highlight):hover {
	color: #f1571c !important;
    text-decoration: underline;
}

main .block-10 a:not(.no-highlight):hover {
    color: #ff639a !important;
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
}

main a.no-highlight:hover {
	color: transparent !important;
}

#amazon-affiliate-header {
    margin: 20px 8%;
    text-align: center;
}

/* Modal */
.modal-open {
	overflow-y: auto !important;
}

.modal.babygit .modal-header, .modal.askadev .modal-header {
	border-bottom: 2px solid #f1571c !important;
}

.modal.ce .modal-header {
	border-bottom: 2px solid #3287c8 !important;
}

.modal-body {
	padding-left: 0 !important;
    padding-right: 0 !important;
}

.modal-title {
	text-align: center;
	font-weight: 500;
}

.modal-content {
    border-radius: 10px !important;
}

.modal.babygit .modal-content, .modal.askadev .modal-content {
	border: solid 2px #f1571c !important;
}

.modal.ce .modal-content {
	border: solid 2px #3287c8 !important;
}

.modal.devlands-domain .modal-inner {
    background: linear-gradient(to bottom, #9b9bb3, #353748);
}

.modal.devlands-domain .modal-content {
    background-color: white !important;
    border-radius: 40px !important;
}

.modal.devlands .modal-content {
    border: 25px solid transparent;
    border-width: 25px;
    border-image: url(/img/initialcommit/tutorial_popup.webp) 60 round;
}

.modal.devlands button.close, .modal.devlands button.close:hover {
    color: #1e7b21 !important;
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
}

.modal.devlands a.dropdown-item {
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
}

@media (min-width: 576px) {
    .modal.devlands .modal-dialog {
        max-width: 550px !important;
    }
}

button.close {
	opacity: 0.8;
	text-shadow: none;
}

.modal.babygit button.close, .modal.askadev button.close {
	color: #f1571c;
}

.modal.ce button.close {
	color: #3287c8;
}

button.close:hover {
	color: white;
}

#emailCaptureForm {
	text-align: center;
}

#emailCaptureForm3 {
	width: 75%;
    margin: 0 auto;
}

.emailCaptureFormDiv1 {
	display: inline-block;
    width: 50%;
    vertical-align: middle;
}

.emailCaptureFormDiv2 {
	display: inline-block;
    width: 30%;
    margin-left: 5%;
    vertical-align: middle;
}

#emailCaptureSubmit, #emailCaptureSubmit2, #emailCaptureSubmit3, #emailCaptureSubmit4, #emailCaptureSubmit5, #emailCaptureSubmit6 {
    color: white;
    padding-left: 7px;
    padding-right: 7px;
}

.modal.babygit #emailCaptureSubmit,
#emailCaptureSubmit2,
#emailCaptureSubmit3,
.decoding-git-guidebook-for-developers #emailCaptureSubmit4,
#emailCaptureSubmit5 {
	background-color: #f1571c;
    border-color: #f1571c;
}

.modal.ce #emailCaptureSubmit,
.modal.ce #emailCaptureSubmit2,
.coding-essentials-guidebook-for-developers #emailCaptureSubmit4 {
	background-color: #3287c8;
    border-color: #3287c8;
}

.modal.devlands #emailCaptureSubmit,
.modal.devlands #emailCaptureSubmit2,
.modal.devlands #emailCaptureSubmit6,
.devlands #emailCaptureSubmit2,
.devlands #emailCaptureSubmit4 {
    background-color: #1e7b21;
    border-color: #1e7b21;
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
}

.modal.babygit #emailCaptureSubmit:hover,
#emailCaptureSubmit2:hover,
#emailCaptureSubmit3:hover,
.decoding-git-guidebook-for-developers #emailCaptureSubmit4:hover,
#emailCaptureSubmit5:hover {
	background-color: #d43c02;
    border-color: #d43c02;
}

.modal.ce #emailCaptureSubmit:hover,
.modal.ce #emailCaptureSubmit2:hover,
.coding-essentials-guidebook-for-developers #emailCaptureSubmit4:hover {
	background-color: #2972aa;
    border-color: #2972aa;
}

.modal.devlands #emailCaptureSubmit:hover,
.modal.devlands #emailCaptureSubmit2:hover,
.modal.devlands #emailCaptureSubmit6:hover,
.devlands #emailCaptureSubmit2:hover,
.devlands #emailCaptureSubmit4:hover {
    background-color: #004103;
    border-color: #004103;
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
}

.modal.babygit #emailCaptureSubmit:focus,
.modal.babygit #emailCaptureSubmit:active,
#emailCaptureSubmit2:focus,
#emailCaptureSubmit2:active,
#emailCaptureSubmit3:focus,
#emailCaptureSubmit3:active,
.decoding-git-guidebook-for-developers #emailCaptureSubmit4:focus,
.decoding-git-guidebook-for-developers #emailCaptureSubmit4:active,
#emailCaptureSubmit5:focus,
#emailCaptureSubmit5:active {
	box-shadow: 0 0 0 0.2rem rgba(212, 60, 2, 0.5) !important;
}

.modal.ce #emailCaptureSubmit:focus,
.modal.ce #emailCaptureSubmit:active,
.modal.ce #emailCaptureSubmit2:focus,
.modal.ce #emailCaptureSubmit2:active,
.coding-essentials-guidebook-for-developers #emailCaptureSubmit4:focus
.coding-essentials-guidebook-for-developers #emailCaptureSubmit4:active {
	box-shadow: 0 0 0 0.2rem rgba(41, 114, 170, 0.5) !important;
}

.modal.devlands #emailCaptureSubmit:focus,
.modal.devlands #emailCaptureSubmit:active,
.modal.devlands #emailCaptureSubmit2:focus,
.modal.devlands #emailCaptureSubmit2:active,
.modal.devlands #emailCaptureSubmit6:focus,
.modal.devlands #emailCaptureSubmit6:active,
.devlands #emailCaptureSubmit4:focus,
.devlands #emailCaptureSubmit4:active {
    box-shadow: 0 0 0 0.2rem rgba(0, 65, 3, 0.5) !important;
}

#emailCaptureClose {
	float: right;
}

#email, #interest, #bookFormat {
	font-size: 14px;
	padding-right: 5px;
    padding-left: 10px;
}

.modal.babygit #email:focus, .modal.askadev #email:focus {
	border-color: rgba(212, 60, 2, 0.5);
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(212, 60, 2, 0.5);
}

.modal.ce #email:focus {
	border-color: rgba(41, 114, 170, 0.5);
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(41, 114, 170, 0.5);
}

.input-group-append button {
	border-top-right-radius: 0.2rem !important;
    border-bottom-right-radius: 0.2rem !important;
}

#emailCaptureConfirmation, #askadevEmailCaptureConfirmation, #emailCaptureConfirmation4, #emailCaptureConfirmation5 {
	display: none;
	margin-top: 10px;
    color: #029402;
}

#interest, #bookFormat {
    pointer-events: none;
}

#interest:focus, #bookFormat:focus {
    border: none;
    box-shadow: none;
}

.modal.babygit .dropdown-toggle, .decoding-git-guidebook-for-developers .dropdown-toggle {
	border-color: #f1571c !important;
    color: #f1571c !important;
}

.modal.ce .dropdown-toggle, .coding-essentials-guidebook-for-developers .dropdown-toggle {
	border-color: #3287c8 !important;
    color: #3287c8 !important;
}

.modal.devlands .dropdown-toggle, .devlands .dropdown-toggle {
    border-color: #1e7b21 !important;
    color: #1e7b21 !important;
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
}

.modal.babygit .dropdown-toggle:hover, .modal.babygit .dropdown-toggle:active, .modal.babygit .show > .dropdown-toggle, .modal.askadev .dropdown-toggle:hover, .decoding-git-guidebook-for-developers .dropdown-toggle:hover {
	color: white !important;
	background-color: #f1571c !important;
}

.modal.ce .dropdown-toggle:hover, .modal.ce .dropdown-toggle:active, .modal.ce .show > .dropdown-toggle, .coding-essentials-guidebook-for-developers .dropdown-toggle:hover {
	color: white !important;
	background-color: #3287c8 !important;
}

.modal.devlands .dropdown-toggle:hover, .modal.devlands .dropdown-toggle:active, .modal.devlands .show > .dropdown-toggle, .devlands .dropdown-toggle:hover {
    color: white !important;
    background-color: #1e7b21 !important;
}

.modal.babygit .dropdown-toggle:focus, .modal.askadev .dropdown-toggle:focus, .decoding-git-guidebook-for-developers .dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem rgba(212, 60, 2, 0.5) !important;
}

.modal.ce .dropdown-toggle:focus, .coding-essentials-guidebook-for-developers .dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem rgba(41, 114, 170, 0.5) !important;
}

.modal.devlands .dropdown-toggle:focus, .devlands .dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 65, 3, 0.5) !important;
}

.modal.babygit .dropdown-item:hover, .modal.babygit .dropdown-item:active, .modal.babygit .dropdown-item:focus, .modal.askadev .dropdown-item:hover, .decoding-git-guidebook-for-developers .dropdown-item:hover {
	background-color: #f1571c !important;
	color: white !important;
}

.modal.ce .dropdown-item:hover, .modal.ce .dropdown-item:active, .modal.ce .dropdown-item:focus, .coding-essentials-guidebook-for-developers .dropdown-item:hover {
	background-color: #3287c8 !important;
	color: white !important;
}

.modal.devlands .dropdown-item:hover, .modal.devlands .dropdown-item:active, .modal.devlands .dropdown-item:focus, .devlands .dropdown-item:hover {
    background-color: #1e7b21 !important;
    color: white !important;
}

.orange {
	color: #f1571c;
}

.blue {
	color: #3287c8;
}

.green {
    color: #1e7b21;
}

.pink {
    color: rgb(254, 80, 118);
}

.front-cover {
	width: 100%;
	display: block;
}

.modal.babygit .front-cover {
	content:url("/img/initialcommit/dg-half-cover.png");
}

.modal.ce .front-cover {
	content:url("/img/initialcommit/ce-half-cover.png");
}

.modal.askadev .front-cover {
	content:url("/img/initialcommit/dg-half-cover.png");
}

.modal.devlands .front-cover {
    content:url("/img/initialcommit/git_branching_commit_history.webp");
}

.readonly {
	background-color: #e4e4e4;
}

.material-icons {
    font-family: 'Material Icons';
    font-style: normal;
    font-size: 24px;
    vertical-align:middle;
    display: inline-block;
    vertical-align: text-bottom;
    width: 24px;
    height: 24px;
}

@font-face {
	font-family: 'Material Icons';
	font-style: normal;
	font-weight: 400;
	src: local('Material Icons'), local('MaterialIcons-Regular'),
		url("https://fonts.gstatic.com/s/materialicons/v18/2fcrYFNaTjcS6g4U3t-Y5RV6cRhDpPC5P4GCEJpqGoc.woff")
		format('woff');
	font-display: swap;
}

.githubBtn:hover, #cta-toast-3 .githubBtn {
	color: black !important;
}

.linkedinBtn:hover, #cta-toast-3 .linkedinBtn {
	color: #0077b5 !important;
}

.instagramBtn:hover, #cta-toast-3 .instagramBtn {
	color: #dd2a7b !important;
}

.facebookBtn:hover, #cta-toast-3 .facebookBtn {
	color: #3b5998 !important;
}

.redditBtn:hover, #cta-toast-3 .redditBtn {
	color: #FF5700 !important;
}

.twitterBtn:hover, #cta-toast-3 .twitterBtn {
	color: #00acee !important;
}

.emailBtn:hover, #cta-toast-3 .emailBtn {
	color: #f1571c !important;
}

.devlands .githubBtn, .devlands .githubBtn:hover, #cta-toast-3 .githubBtn {
    color: black !important;
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
}

.devlands .linkedinBtn, .devlands .linkedinBtn:hover, #cta-toast-3 .linkedinBtn {
    color: #0077b5 !important;
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
}

.devlands .instagramBtn, .devlands .instagramBtn:hover, #cta-toast-3 .instagramBtn {
    color: #dd2a7b !important;
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
}

.devlands .facebookBtn, .devlands .facebookBtn:hover, #cta-toast-3 .facebookBtn {
    color: #3b5998 !important;
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
}

.devlands .redditBtn, .devlands .redditBtn:hover, #cta-toast-3 .redditBtn {
    color: #FF5700 !important;
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
}

.devlands .twitterBtn, .devlands .twitterBtn:hover, #cta-toast-3 .twitterBtn {
    color: #00acee !important;
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
}

.devlands .emailBtn, .devlands .emailBtn:hover, #cta-toast-3 .emailBtn {
    color: #ff639a !important;
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
}

/* Nav */
nav {
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	z-index: 3 !important;
}

.navbar {
	height: 64px;
	padding: 0 !important;
}

.navbar a:not(.rss-link) {
	margin: 0 10px;
	font-size: 14px;
}

.navbar a:hover {
	color: #f1571c !important;
	background-color: rgba(0, 0, 0, 0.05);
}

.navbar-brand {
	position: absolute;
    margin-left: 30px !important;
}

.navbar-toggler {
	outline: none !important;
	padding: .75rem .75rem !important;
	margin-left: 20px;
}

nav.devlands {
    box-shadow: none !important;
    z-index: 5 !important;
    pointer-events: none;
}

nav.devlands .navbar-brand {
    display: none !important;
}

nav.devlands .container {
    position: absolute;
    max-width: fit-content;
    left: 25vw;
    transform: translateX(-50%);
}

nav.devlands .navbar-collapse:not(.show) {
    display: initial;
}

nav.devlands #light-dark-toggle {
    display: none !important;
}

nav.devlands .rss {
    display: none !important;
}

nav.devlands .nav-link {
    color: black !important;
    pointer-events: all !important;
    font-size: 1.75em;
    padding-top: 75px;
}

nav.devlands a:not(.rss-link) {
    margin: 0 20px;
}

nav.devlands a.nav-link:hover {
    color: #ff639a !important;
    background-color: transparent !important;
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
}

#hamburger, #rss {
	font-size: 35px;
}

.rss {
	position: absolute;
    right: 20px;
	text-decoration: none !important;
}

#rss:hover {
	color: #f1571c !important;
}

#light-dark-toggle {
	position: absolute;
    right: 100px;
    width: 35px;
    cursor: pointer;
}

/* Toast */
#toaster {
	position: fixed;
	top: 65px;
	right: 5px;
	z-index: 3;
}

.toast-header {
	color: #777;
}

.toast-header img {
    width: 15px;
}

.toast-header div {
    padding-right: 75px;
    font-weight: 600;
    color: black;
}

.toast-header button.close {
	color: black;
}

.toast-header button.close:hover {
	color: #f1571c;
}

.toast-body {
	background-color: rgba(255,255,255,.9);
	padding: .75rem;
    font-weight: 500;
    font-size: 12px;
}

/* Code */

pre[class*="language-"], code[class*="language-"], .token.operator {
    background: none;
    text-shadow: none;
}

span.token.parameter, span.token.property-access, span.token.this,
span.token.namespace, span.token.package, span.token.generics,
span.token.maybe-class-name {
    color: black;
}

/* Overlay */

#overlay {
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.75);
  z-index: 3;
  cursor: pointer;
}

/* Footer */
footer {
	margin-top: 50px;
    padding-top: 20px;
    text-align: center;
    position: relative;
    z-index: 1;
}

footer a:hover {
	color: #f1571c !important;
	text-decoration: none !important;
}

footer.devlands a, footer.devlands div {
    color: black !important;
}

footer.devlands a:hover {
    cursor: url(/img/devlands/cursor_hand.webp) 15 7, auto !important;
    color: #ff639a !important;
    background-color: transparent !important;
}

.footer-copyright {
	font-weight: lighter;
}

#privacy-policy-link:hover {
	color: #f1571c !important
}

footer.devlands #privacy-policy-link:hover {
    color: #ff639a !important
}

/* Animation */
.flash {
	animation: flash 1.5s infinite;
}

@keyframes flash {
	0% { background-color: #f1571c; box-shadow: 0 0 0 10px #f1571c; }
    50% { background-color: black; box-shadow: none; }
    100% { background-color: #f1571c; box-shadow: 0 0 0 10px #f1571c; }
}

.flash-border {
	animation: flash-border 1.5s infinite;
}

@keyframes flash-border {
	0% { box-shadow: 0 0 0 10px #f1571c; }
    50% { box-shadow: none; }
    100% { box-shadow: 0 0 0 10px #f1571c; }
}

/* Misc */
button:focus {
	outline: none !important;
}

/* Ads */

.ad-title {
	padding: 0 !important;
    margin: 5px 0 0 5px !important;
    color: #777 !important;
    font-size: 12px;
}

#topright-sidebar-ad {
    width: 25%;
    margin: 0 15px;
    float: right;
}

.right-sidebar-ad-slot:first-of-type {
	margin: 5px;
}

.devlands.contact .right-sidebar-ad-slot:first-of-type {
    display: none;
}

.right-sidebar-ad-slot:not(:first-of-type) {
	margin: 15px 5px 15px 5px;
}

.right-sidebar-ad-wrapper .waldo-display-unit {
    max-width: 350px;
}

#header-ad, #footer-ad, .right-sidebar-ad-slot.ad {
    border-radius: .25rem;
}

#header-ad, #footer-ad {
	width: 94%;
}

#header-ad {
	margin: 5px auto 30px auto;
}

#footer-ad {
	margin: 50px auto 0 auto;
}

#header-ad .adsbygoogle, #header-ad-wrapper, #footer-ad .adsbygoogle {
	text-align: center;
}

.header-ad-wrapper {
    min-height: 90px;
}

#rfsn_img_34057 img {
	width: 100%;
}

.google-auto-placed {
	margin-bottom: 25px;
    clear: none !important;
}

.waldo-display-unit {
	clear: none !important;
}

/* Blocks */

.block-5 .block-image, .block-6 video {
	width: 100%;
	height: auto;
	border-radius: 3px;
}

@media only screen and (max-width: 2499px) {
    nav.devlands .container {
        left: 17.5vw;
    }
    
    nav.devlands .nav-link {
    font-size: 1.25em;
    padding-top: 50px;
    }
}

@media only screen and (max-width: 1499px) {
    nav.devlands .container {
        left: 17.5vw;
        max-width: max-content;
    }
    
    nav.devlands .nav-link {
        font-size: 1em;
        padding-top: 15px;
    }
    
    nav.devlands a:not(.rss-link) {
        margin: 0;
    }
    
    .navbar-expand-lg .navbar-nav .nav-link {
        padding-right: .75rem;
        padding-left: .75rem;
    }
}

/* Medium and small screens */
@media only screen and (max-width: 991px) {
    
    /* Nav */
    .navbar-brand {
        margin-left: 90px !important;
    }
    
    .navbar a:not(.rss-link):not(.navbar-brand) {
    	color: black !important;
    	padding: 8px 0px !important;
    	margin-left: 30px !important;
    }
    
    .navbar .container {
    	background-color: white;
    	max-width: initial;
    }
    
    /* Toaster */
    #toaster {
		top: 0px;
	    right: 0px;
	}
    
}