@import url("https://fonts.googleapis.com/css?family=Montserrat:100,300,400,500,600,700,800,900");
/* 
@import url('https://fonts.googleapis.com/css?family=Oleo+Script:400,700');
@import url('https://fonts.googleapis.com/css?family=Fredoka+One');
*/
@import url("https://fonts.googleapis.com/css?family=Raleway:100,200,300,400,500,700,900");
@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900");

.site-menu ul li a {
	font-weight: 300;
	font-family: "Montserrat", sans-serif;
}
.btn {
	font-weight: 300;
	font-family: "Montserrat", sans-serif;
}

.dark-btn {
	background-color: #c43258;
	border: 0.03em solid transparent;
	color: #fff !important;
	border-radius: 0.2em;
	font-size: 0.9em;
	font-weight: 300;
	font-family: "Montserrat", sans-serif;
	padding: 0.7em 2.1em;
	text-transform: uppercase;
	transition: all ease 0.3s;
	display: inline-block;
	cursor: pointer;
}

.dark-btn:hover {
	background-color: #fff;
	color: #ffcb2f !important;
	border: 1px solid #ffcb2f;
}
.dezari_logo {
	font-family: "Montserrat", sans-serif;
	/* font-family: 'Oleo Script', cursive;  */
	/* font-family: 'Fredoka One', cursive; */
	font-size: 60px;
	font-weight: 700;
	padding: 5px;
	color: #ffcb2f;
}

.site-header {
	height: 5.8em;
}

.banner-text h1::after {
	background-color: #ffcb2f;
	content: "";
	display: inherit;
	height: 0.09em;
	left: 0;
	margin-top: 0.3em;
	position: relative;
	top: 0;
	transform: none;
	width: 4.7em;
	margin-bottom: 30px;
}

.banner-text h1 {
	font-size: 30px;
	font-weight: 100;
	margin: 0 0 15px;
	position: relative;
	font-family: "Montserrat", sans-serif;
	line-height: 55px;
	margin-top: -50px;
}

.banner-wrapper p {
	/* font-family: 'Raleway', sans-serif; */
	font-family: "Raleway", sans-serif;
	text-align: justify;
}

.circle-icon::before {
	background: #ffcb2f none repeat scroll 0 0;
	border-radius: 50%;
	content: "";
	height: 23%;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	transform-origin: center center 0;
	transition: transform 0.25s cubic-bezier(0, 0.6, 0.7, 1) 0s,
		-webkit-transform 0.25s cubic-bezier(0, 0.6, 0.7, 1) 0s;
	width: 23%;
	z-index: -1;
}
h3.title.mt-3 {
	font-family: "Montserrat", sans-serif;
	text-transform: uppercase;
}

@media (min-width: 768px) {
	.burger {
		padding: 35vh 0;
	}
}
.page-caption::after {
	background-color: #ffcb2f;
	content: "";
	display: inherit;
	height: 0.23em;
	left: 0;
	margin-top: 0.4em;
	position: relative;
	top: 0;
	transform: none;
	width: 2.5em;
}

.page-caption {
	display: block;
	text-transform: uppercase;
	color: #00c3ff;
	font-size: 20px;
	font-weight: 300;
}
.page-head h2 {
	font-size: 30px;
	color: #00c3ff;
	font-family: "Montserrat", sans-serif;
}

.page-head p {
	font-family: "Raleway", sans-serif;
}

.service-item .card {
	cursor: pointer;
}
.service-item .card:hover,
.service-item .card:focus {
	box-shadow: 0 0.5em 0.5em -0.4em var(--hover);
	transform: translateY(-0.25em);
}
.portfolio-tabs li:before {
	background-color: #ffcb2f;
}

/* --- custom css --- */

.action-call {
	text-align: center;
	margin: auto;
	padding-top: 50px;
	padding-bottom: 30px;
}

.portfolio-btn {
	position: absolute;
	left: 10px;
	text-transform: uppercase;
	background-color: #00c3ff;
	color: #fff;
	padding: 15px;
}

.portfolio-btn:hover,
.portfolio-btn:focus {
	color: #00c3ff;
	border: 1px solid #00c3ff;
	background-color: #fff;
	padding: 15px;
}

.qoute-btn {
	position: absolute;
	right: 10px;
	text-transform: uppercase;
	background-color: #c43258;
	color: #fff;
	padding: 15px;
}

.qoute-btn:hover,
.qoute-btn:focus {
	color: #ffcb2f;
	border: 1px solid #ffcb2f;
	background-color: #fff;
	padding: 15px;
}

.circle-icon.bottom.redirect-btn {
	position: absolute;
	bottom: 150px;
	left: 50vw;
}

div#primary-menu {
	padding-top: 20px;
	font-size: 18px;
}

.pink-bg {
	background: #c43258 !important;
	color: #fefefe !important;
}
.blue-bg {
	background: #00c3ff !important;
}
.yellow-bg {
	background: #ffcb2f !important;
}
.post {
	font-family: "Raleway", sans-serif;
	text-align: left;
}
section#portfolio {
	background: #fff;
}
section#about {
	background-color: #ffcb2f;
}

section#about .page-caption::after {
	background-color: #fff;
}
.site-footer {
	background: #222222;
	color: #fff;
}
p.about-us {
	font-size: 30px;
	color: #fff;
}
.site-menu ul li a:hover {
	color: #00c3ff !important;
}