/*
Theme Name: Dukal Store 2016
Theme URI: http://alexdukal.com/themes/dukal
Description: A theme for digital goodies & resources
Version: 2.0
Author: Alex Dukal
Author URI: http://alexdukal.com
*/

/*******************************************
* Dukal Store Theme Help Scheme
* Body Background #242628
* Darkest Color #0c0c0c
* Main Nav Background #23222a
* Links #9c2630
* Links Dark #800c2a
* Button Border #6a0627
* Hover #a64d5b
* Grey #9b9b9b
* Light Grey #eeeeee
* 
* Buttons Back #9c2630
* Buttons Border #800c2a
* Buttons Hover Back #800c2a
* Buttons Hover Border #6a0627
*******************************************/

/*---------------------------------------------------------
GLOBAL
-------------------------------------------------------- */

html,
body {
    height: 100%;
}
html {
	font-size: 1.000em;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body {
    padding-top: 40px; /* Required padding for .navbar-fixed-top. */
	background-color: #242628;
	background-image: url('./images/bck.jpg');
	background-position: center top;
	background-repeat: no-repeat;
	background-attachment: fixed;
	font-family: 'Lato', sans-serif;
}
a {
	outline: 0;
	color: #9c2630;
	background-color: transparent;
	text-decoration: none; 
}
a:active,
a:hover,
a:focus {
	outline: 0;
	color: #0c0c0c;
	text-decoration: none;
}
small {
  font-size: 80%;
}

/*---------------------------------------------------------
TITLES
-------------------------------------------------------- */

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
	margin: 11px 0;
	font-family: 'Francois One', sans-serif;
	font-weight: bold;
}

h1 a,
a h1,
h2 a,
a h2,
h3 a,
a h3,
h4 a,
a h4,
h5 a,
a h5,
h6 a,
a h6 {
	color: inherit;
	text-decoration: none;
}

h1 {
	font-size: 3.000em;
	font-weight: bold;
	line-height: 1.2;
}

h2 {
	font-size: 2.250em;
}

h3 {
	font-size: 1.875em;
}

h4 {
	font-size: 1.500em;
	font-weight: normal;
}

h5 {
	font-size: 1.125em;
	letter-spacing: 1px;
	text-transform: uppercase;
}

h6 {
	font-size: 1.000em;
	font-weight: normal;
	letter-spacing: 2px;
	text-transform: uppercase;
}
@media (max-width: 480px) {
	h1 {
		font-size: 1.475em;
		line-height: 1;
	}
	h2 {
		font-size: 1.375em;
		line-height: 1;
	}
	h3 {
		font-size: 1.264em;
	}
}
.top-buffer { margin-top:40px; }
.bottom-buffer { margin-bottom:40px; }
.coloring {
	padding: 40px 0 20px 0;
}
hr {
	border-top: none;
}
.img-portfolio {
    margin-bottom: 30px;
}
.img-hover:hover {
    opacity: 0.8;
}
.page-header {
	padding-bottom: 9px;
	margin: 40px 0 20px;
	border: none;
}
.mainwrapper {
	background-color: #ffffff;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
}
.alignleft {
	float: left;
	padding: 0px;
	margin: 10px 15px 15px 0px !important;
}
.upcoming {
	color: white;
	font-size: 1.500em;
	font-weight: bold;
	text-align: center;
	width: 90%;
	margin: 15px auto 15px;
}

/********************************
* RED BUTTONS
********************************/

.edd-submit.button.red {
	color: #ffffff;
	background: #9c2630;
	border-color: #800c2a;
}
.edd-submit.button.red:hover,
.edd-submit.button.red:focus,
.edd-submit.button.red:active {
	color: #ffffff;
	background: #800c2a;
	border-color: #6a0627;
}
.edd-submit.button.red:active {
	background-image: none;
}

/********************************
* HOME PAGE
********************************/

.greeny {
	background-color: #6B8E23;
}
.redish {
	background-color: #9c2630;
}
.tutos {
	background: #9c2630 url('./images/articles.png') left center no-repeat;
}
.tutos-header {
	color: #fff;
	padding: 0;
	margin: -20px 0 20px;
	border: none;
	letter-spacing: 0.035em;
	font-weight: normal;
}
.cd-top.cd-is-visible {
	visibility: visible;
	opacity: 1;
}
.cd-top.cd-fade-out {
	opacity: .5;
}

/********************************
* NAVIGATION BARS 
********************************/

.navh {
	visibility: hidden;
	height: 1px;	
}
.navbar {
	background-color: #0c0c0c;
	min-height: 40px;
	margin-bottom: 20px;
	border: none;
	font-size: 1.000em;
	font-weight: bold;
}
@media (min-width: 768px) {
  .navbar {
    border-radius: 0;
  }
}
.navbar-brand {
/*---------------------------------------------------------
	background-image: url('./images/ad-store-logo.png');
	background-position: center center;
	background-repeat: no-repeat;
	text-indent:-9999px;
--------------------------------------------------------- */
	width: 230px;
	height: 40px;
	padding: 12px 20px 8px 10px;
	font-family: 'Francois One', sans-serif;
	font-size: 1.700em;
	text-transform: uppercase;
	font-weight: normal;
}
.navbar-brand a:hover,
.navbar-brand a:focus {
	font-weight: normal;
}
@media (max-width: 768px) {
	.navbar-brand {
		padding: 13px 25px;
	}
}
@media (max-width: 480px) {
	.navbar-header a.navbar-brand {
		font-size: 1.300em;
		padding-top: 15px;
	}
	#ad-navbar-collapse-1 li {
		border-bottom: 1px solid #292929;
	}
}
.navbar-nav > li > a {
	padding-top: 5px;
	padding-bottom: 5px;
	line-height: 30px;
}
.ad-mainnav {
	background-color: #23222a;
	font-family: 'Francois One', sans-serif;
	font-size: 1.200em;
	text-transform: uppercase;
}
ul#menu-main-nav {
	display: block;
	padding-left: 20px;
	margin-bottom: 0;
	list-style: none;
}
ul#menu-main-nav > li {
	float: left;
	margin-bottom: 0px;
	position: relative;
	display: block;
}
ul#menu-main-nav > li > a {
	color: #eeeeee;
	margin-right: 1px;
	line-height: 1.42857143;
	border: none;
	position: relative;
	display: block;
	padding: 10px 12px;
}
ul#menu-main-nav > li > a:hover,
ul#menu-main-nav > li > a:focus {
	color: #eeeeee;
	background-color: #0c0c0c;
	background-image: url('./images/nav-active.png');
	background-position: center bottom;
	background-repeat: no-repeat;
	border: none;
	text-decoration: none;
}
ul#menu-main-nav > li.current-menu-item > a {
	color: #eeeeee;
	background-color: #9c2630;
	background-image: url('./images/nav-active.png');
	background-position: center bottom;
	background-repeat: no-repeat;
	border: none;
	text-decoration: none;
}
@media(max-width:767px) {
	.navh {
		visibility: visible;
		height: auto;	
	}
	.navbar-header {
		padding-right: 10px;
	}
	.navbar-right {
		text-align: center;
	}
	ul#menu-main-nav {
		visibility: hidden;
		height: 10px;		
		padding: 0;
		width: 100%;
		border-bottom: 0;
	}
	ul#menu-main-nav > li {
		float: none;
		display: block;
		width: 100%;
	}
	ul#menu-main-nav > li > a {
		margin-bottom: 0;
		text-align: center;
	}
}
@media (max-width: 480px) {
	.navh {
		visibility: visible;
		height: auto;	
	}
	.navbar-header {
		padding-right: 10px;
	}
	.navbar-right {
		text-align: center;
	}
	ul#menu-main-nav {
		visibility: hidden;
		height: 10px;		
		padding: 0;
		width: 100%;
		border-bottom: 0;
	}
	ul#menu-main-nav > li {
		float: none;
		display: block;
		width: 100%;
	}
	ul#menu-main-nav > li > a {
		margin-bottom: 0;
		text-align: center;
	  }
}

/********************************
* 404 ERROR PAGES 
********************************/

.error-404 {
    font-size: 7.143em;
}

/********************************
* SINGLE PAGE
********************************/

.single-header {
	background-color: #9c2630;
	background-image: url('./images/page-header01.jpg');
	background-position: left center;
	background-repeat: no-repeat;
	padding: 20px;
	height: 160px;
}
.ind-prod {
	margin-top: 40px;
	margin-bottom: 100px;
	font-size: 1.250em;
}
.ind-prod h1 {
	margin-bottom: 40px;
}
.ind-prod img {
	max-width: 100%;
	height: auto;
	margin-top: 15px;
	margin-bottom: 15px;
}
.ind-prod iframe {
	margin-top: 15px;
	margin-bottom: 15px;
}
.navigation {
	margin-bottom: 60px;
}
.edd_purchase_submit_wrapper {
	margin-top: 30px;
}
@media (max-width: 480px) {
	.ind-prod {
		font-size: 1.012em;
		text-align: justify;
		font-weight: bold;
		line-height: 1.3;
	}
	.ind-prod iframe {
		max-width: 100%;
		height: auto;	
	}
}

/********************************
* PROFILE & DOWNLOADS TABS
********************************/

.nav-tabs {
	border: none;
	z-index: 1;
	position: relative;
}
.nav-tabs > li {
	float: left;
	margin-bottom: -1px;
}
.nav-tabs > li > a {
	color: #333333;
	background-color: #d1d1d1;
	margin-right: 4px;
	margin-bottom: -4px;
	line-height: 1.42857143;
	border: 1px solid transparent;
	border-bottom: none;
	border-radius: 4px 4px 0 0;
}
.nav-tabs > li > a:hover {
	border-color: #a1a1a1;
	background-color: #a1a1a1;	
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
	color: #eee;
	cursor: default;
	background-color: #333333;
	border: none;
	border-bottom-color: transparent;
}
#tab-content {
	position: relative;
	background-color: #e3e3e3;
	min-height: 460px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	padding: 30px;
	border-top: 5px solid #333333;
	z-index: 3;
}
#edd_profile_billing_address_label, #edd_profile_billing_address_wrap {
	display: none;
	visibility: hidden;
}
#edd_profile_name_label legend, #edd_profile_password_label legend {
	font-weight: bold;
	font-size: 1.524em;
}
#edd_profile_password_label legend {
	margin-top: 40px;
}
input#edd_profile_editor_submit {
	margin-top: 20px;
	padding: 5px 10px 5px 10px;
	color: #ffffff;
	background: #9c2630;
	border: 1px solid #800c2a;
	border-radius: 4px;
}
input#edd_profile_editor_submit:hover,
input#edd_profile_editor_submit:focus,
input#edd_profile_editor_submit:active {
	color: #ffffff;
	background: #800c2a;
	border: 1px solid #6a0627;
}
input#edd_profile_editor_submit:active {
	background-image: none;
}
table#edd_user_history {
	width: 100%;
	border-collapse:collapse;
	border-spacing:0;
}
table#edd_user_history td, table#edd_user_history th {
	border: 1px solid #333333 !important;
}
table#edd_user_history th.edd_download_download_name, table#edd_user_history th.edd_download_download_files {
	background-color: #333333;
	padding: 6px;
	color: #eee;
}
table#edd_user_history td.edd_download_download_name, table#edd_user_history td.edd_download_download_files {
	background-color: #e3e3e3;
	padding: 6px;
	font-size: 0.875em;
	font-weight: bold;
}

/********************************
* USER LOGIN 
********************************/

form#edd_login_form, form#edd_register_form {
	width: 100%;
	margin-top: 50px;
}
#edd_login_form legend, #edd_register_form legend {
	display: none;
	visibility: hidden;	
}
input#edd_login_submit, form#edd_register_form input.button {
	margin-top: 20px;
	margin-bottom: 20px;
	padding: 5px 10px 5px 10px;
	color: #ffffff;
	background: #9c2630;
	border: 1px solid #800c2a;
	border-radius: 4px;
}
input#edd_login_submit:hover, form#edd_register_form input.button:hover,
input#edd_login_submit:focus, form#edd_register_form input.button:focus,
input#edd_login_submit:active, form#edd_register_form input.button:active {
	color: #ffffff;
	background: #800c2a;
	border: 1px solid #6a0627;
}
input#edd_login_submit:active, form#edd_register_form input.button:active {
	background-image: none;
}

/********************************
* DOWNLOADS PRODUCTS 
********************************/

.panel {
  border: none;
  border-radius: 0;
}
.panel-body {
	background-color: #d9d9d9;
	padding: 0;
}
.panel-body h2 a {
	color: #333;
}
.panel-body h2 a:active,
.panel-body h2 a:hover,
.panel-body h2 a:focus {
	color: #9c2630;
}
.panel-body p {
	padding: 0 25px 0 25px;
	font-size: 1.143em;
	font-weight: bold;
}
@media (max-width: 480px) {
	.panel-body h2 {
		margin: 10px auto 5px;
	}
	.panel-body p {
		padding: 0 15px 0 15px;
		font-size: 1.000em;
		line-height: 1.350em;
	}
}
.ad-prodshadow {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.ad-boxshadow {
	-webkit-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.62);
	-moz-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.62);
	box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.62);
}
.prod {
	margin-bottom:15px;
	text-align: center;
}
.panel-default > .panel-heading {
	color: #333333;
}
.panel-default > .panel-heading .badge {
  color: #f5f5f5;
  background-color: #333333;
}
.panel-heading {
	padding: 6px 15px;
	border-bottom: none;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}
.product-buttons {
	margin: 0px auto 25px;
}
.price {
    display: block;
}
.product-image {
	width: 100%;
}
.product-image img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
}
.period {
    display: block;
    font-style: italic;
}
.edd-cart-added-alert {
	display: none;
	visibility: hidden;
}

/********************************
* REDISH TUTO IMAGES 
********************************/

.ad-tutofront {
	display: inline-block;
	width: 100%;
	border: none;
	border-radius: 0;
	padding: 0;
	position: relative;
	text-align: center;
}
.ad-tutofront figure {
	margin: 0;
	position: relative;
}
.ad-tutofront img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	position: relative;
}
.ad-tutofront figcaption {
	position: absolute;
	top: 0;
	left: 0;
	padding: 10px 10px 10px 10px;
	background-color: #171717;
	background-color:rgba(23, 23, 23, 0.9);
	color: #a9a9a9;
}
.ad-tutofront span {
	font-size: 16px;
	margin: 0 auto 0;
	padding: 0;
}
.ad-tutofront figcaption h4 {
	margin: 5px auto 0;
	padding: 0;
	color: #a9a9a9;
}

.ad-tutofront figcaption a {
	text-decoration: none;
	color: #a9a9a9;
}
.ad-tutofront figcaption a:hover {
	text-decoration: none;
	color: #FFF;
}
.img-card figure {
	overflow: hidden;
}
.img-card figcaption {
	height: 80px;
	width: 100%;
	top: auto;
	bottom: 0;
	opacity: 1;
}
.no-touch .img-card figure:hover figcaption,
.img-card figure.cs-hover figcaption {
	opacity: 1;
}
@media (max-width: 480px) {
	.ad-tutofront figcaption h4 {
		font-size: 1.056em;
	}
	.ad-tutofront figcaption {
		padding: 6px 8px 6px 8px;
	}
	.img-card figcaption {
		height: 70px;
	}
	.ad-tutofront figcaption h4 {
		margin: 5px auto 0;
	}
}

/********************************
* FOOTER 
********************************/

footer {
    margin: 0;
	padding: 0;
}
.footer {
	width: 100%;
	background-color: #23222a;
	margin: 0 auto 0;
	padding: 20px 0 10px 0;
	color: #6a625d;
	text-align: center;
}
.footer p {
	font-size: 0.875em;
	letter-spacing: 0.0725em;
	font-weight: normal !important;
}
.footer a {
	color: #6a625d;	
}
.footer a:hover,
.footer a:focus {
	color: #eeeeee;
	border: none;
	text-decoration: none;
}
.footer blockquote {
	width: 80%;	
	color: #6a625d;
    border: none;
	padding: 15px;
	margin: 0 auto 20px;
	font-size: 1.500em;
	font-weight: 400;
	font-style: italic;
}

/********************************
* COMMENTS 
********************************/

.commentsbox {
	padding-bottom: 40px;
}
ol.commentlist {
	margin-top: 40px !important;
	margin-left: 0;
	padding-left: 0;
}
ol.commentlist .vcard img {
	margin: 5px 10px 10px 0;
}
ol.commentlist li p {
	margin-top: 10px;
	margin-bottom: 10px;
}
ol.commentlist li {
	padding-left: 10px;

}
ol.commentlist .comment-body {
	padding: 20px;
	border-left: 5px solid #333;

}
ol.commentlist li .comment-body {
	margin-top: 30px;
	background-color: #dedede;
}
ol.commentlist li ul.children li {
	list-style-type: none;
}
ol.commentlist li ul.children li .comment-body {
	background-color: transparent;
	margin-top: 0 !important;
}
#respond {
	margin-top: 40px;
}

.fn, .says {
	font-weight: bold;
}
.commentmetadata {
	font-size: 0.813em;	
}
#commentform textarea {
	background-color: #dedede;
	width: 100%;
	border: 1px solid #333;
	border-top: 5px solid #333;
}

input[type="submit"]#commentsubmit {
	display: inline-block;
	padding: 6px 12px;
	margin: 0;
	font-size: 14px;
	font-weight: normal;
	line-height: 1.428571429;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	cursor: pointer;
	border: 1px solid #cccccc;
	border-radius: 4px;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}
input[type="submit"]#commentsubmit:focus {
	outline: thin dotted #333;
	outline: 5px auto -webkit-focus-ring-color;
	outline-offset: -2px;
}
input[type="submit"]#commentsubmit:hover,
input[type="submit"]#commentsubmit:focus {
	text-decoration: none;
}
#commentsubmit:active {
	background-image: none;
	outline: 0;
	-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

/** GRAY BUTTONS */

#commentsubmit, #commentsubmit:visited {
	color: #eeeeee;
	background-color: #171717;
	border-color: #333;
}
#commentsubmit:hover,
#commentsubmit:focus,
#commentsubmit:active {
	color: #FFFFFF;
	background: #2e2e2e;
	border-color: #333;
}
#commentsubmit:active {
	background-image: none;
}

/********************************
* DOWNLOADS TABLE 
********************************/

#edd_checkout_cart {
	width: 100%;
	border-collapse:collapse;
	border-spacing:0;
}
#edd_checkout_cart td, #edd_checkout_cart th {
	border: 1px solid #b6b6b6 !important;
}

#edd_checkout_cart .edd_cart_header_row th, #edd_checkout_cart .edd_cart_header_row td {
	background-color: #dadada;
	padding: 10px;
}
#edd_checkout_cart tr.edd_cart_footer_row th {
	border-left: none !important;
	border-right: none !important;
}
#edd_checkout_cart tr.edd_cart_footer_row th.edd_cart_total {
	background-color: #dadada;
	border-left: 1px solid #b6b6b6 !important;
	border-right: 1px solid #b6b6b6 !important;
}
th.edd_cart_actions, td.edd_cart_actions {
	text-align:center !important;
}
#edd-user-login, #edd-user-email, #edd-user-pass, #edd-user-pass2 {
	height: 28px;
}
input#edd_agree_to_terms {
	width: 20px;	
}
.edd_form {
	width: 100%;
	padding: 0;
	margin: 0;
}
fieldset#edd_checkout_user_info {
	margin: 20px 0 0 0;
	padding: 0;
	border: none;
}
#edd_terms {
	background-color: #e6d8db;
	border-left: 5px solid #333333;
	padding: 8px;
	font-style: italic;
	font-size: 0.875em;	
	margin: 15px auto 25px;
}
#edd_checkout_user_info legend, #edd_register_form legend {
	width: 100%;
	font-size: 1.500em;
	line-height: 1em;
	padding: 6px 0px 0px 0px;
	border-bottom: 5px solid #333;
	margin-bottom: 30px;
}
#edd_final_total_wrap {
	width: 320px;
	margin-top: 20px;
	margin-bottom: 20px;
	background-color: #dadada !important;
	border: 1px solid #b6b6b6 !important;
}
fieldset#edd_purchase_submit {
	margin-top: 40px;
}
#edd_show_terms a {
	color: #942826;
	font-weight: bold;
}
#edd_show_terms a:active,
#edd_show_terms a:hover {
  outline: 0;
  color: #333333;
  text-decoration: none;
}
.edd-terms-agreement label {
	border: none;
}
.edd_price_options {
	padding-top: 40px;
}
a.edd_cart_remove_item_btn {
	color: #eeeeee;
	border-color: #333;
	background: #171717 url('./images/remove.png') 8px center no-repeat;
	display: inline-block;
	padding: 6px 10px 6px 30px;
	margin-bottom: 0;
	font-size: 14px;
	font-weight: normal;
	line-height: 1.42857143;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-ms-touch-action: manipulation;
      touch-action: manipulation;
	cursor: pointer;
	-webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
	border: 1px solid transparent;
	border-radius: 4px;
}
a.edd_cart_remove_item_btn:hover,
a.edd_cart_remove_item_btn:focus,
a.edd_cart_remove_item_btn:active {
	color: #ffffff;
	background: #2e2e2e url('./images/remove.png') 8px center no-repeat;
	border-color: #333;
}

/********************************
* DISCOUNT FORM 
********************************/

#edd-discount-code-wrap .edd-label {
	font-size: 24px;
	font-weight: bold;
	color: #333;
}

/********************************
* RESPONSIVE STYLES 
********************************/

@media(max-width:991px) {
    .customer-img,
    .img-related {
        margin-bottom: 30px;
    }
}

@media(max-width:767px) {
    .img-portfolio {
        margin-bottom: 15px;
    }
}

/* -------------------------------- 
BACK TO TOP
-------------------------------- */

.cd-top {
  display: inline-block;
  height: 40px;
  width: 40px;
  position: fixed;
  bottom: 40px;
  right: 10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: rgba(0, 0, 0, 0.8) url(./images/cd-top-arrow.svg) no-repeat center 50%;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible {
  /* the button becomes visible */
  visibility: visible;
  opacity: 1;
}
.cd-top.cd-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: .5;
}
.no-touch .cd-top:hover {
  background-color: #000;
  opacity: 1;
}
@media only screen and (min-width: 768px) {
  .cd-top {
    right: 20px;
    bottom: 20px;
  }
}
@media only screen and (min-width: 1024px) {
  .cd-top {
    height: 40px;
    width: 40px;
    right: 30px;
    bottom: 30px;
  }
}