/*
  Theme Name: Coastal Coffee Distributors
  License: GNU General Public License v2 or later
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
  Text Domain: mytheme
*/

*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin:0px;padding:0px;}
:before,:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.clear{clear:both;}
.clearfix:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}
img{border:0;max-width:100%;height:auto;vertical-align:middle;}
input, textarea{outline:none;}
*:active, *:focus{outline:0;outline-style:none;outline-width:0;}
a{text-decoration:none; transition: all ease 0.5s;}
a:active, a:focus{outline:0;outline-style:none;outline-width:0;}
li{list-style:none;}
.hide{display:none;}
.show{display:block;}
.vhidden{visibility:hidden;}
.textcenter{text-align:center !important;}
.textleft{text-align:left !important;}
.textright{text-align:right !important;}
.textjustify{text-align:justify !important;}
.alignleft{float:left;margin:0 15px 15px 0;}
.alignright{float:right;margin:0 0 15px 15px;}
.left{float:left;}
.right{float:right;}
.relative{position:relative;}
.absolute{position:absolute;}
h1, h2, h3, h4, h5, h6{font-weight:normal;}
html, body{text-rendering:optimizeLegibility;text-rendering:geometricPrecision;font-smooth:always;font-smoothing:antialiased;-moz-font-smoothing:antialiased;-webkit-font-smoothing:antialiased;-webkit-font-smoothing:subpixel-antialiased;font-weight:400;}
body{-webkit-animation-duration:0.1s;-webkit-animation-name:fontfix;-webkit-animation-iteration-count:1;-webkit-animation-timing-function:linear;-webkit-animation-delay:0.1s;}
@-webkit-keyframes fontfix{from{opacity:1;}
to{opacity:1;}
}
@media screen and (max-device-width:767px) and (orientation:landscape){body{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
}
@media screen and (max-device-width:767px) and (orientation:portrait){body{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
}
body{font-family: 'Poppins', sans-serif; font-weight: 400; background: #E5E5E5;}
.enclose{
    max-width: 1070px;
    width: 100%;
    margin: auto;
}
.header{
    background: #1C0B07;
    border-radius: 0px 0px 20px 20px;
    font-family: 'Poppins', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 36px;
    text-align: center;
    color: #FFFFFF;
    padding: 32px 0px 48px;
}
.header .logo{
    margin-bottom: 40px;
}
.header .h_para{
    max-width: 868px;
    margin: auto;
    width: 100%;
}
.header .header_in{
    position: relative;
}
.header_btns{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    position: absolute;
    right:-105px;
    top: -13px;
}
.header_btns a{
    font-family: 'Poppins', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 18px;
    line-height: 56px;
    text-align: center;
    color: #FFFFFF;
    padding: 0px 20px;
    display: inline-block;
    border-radius: 16px;
}
.header_btns a:hover{
    background: #6C903D;
    color: #fff;
}
.header_btns li:last-child{
    margin-left: 13px;
}
.header_btns li:last-child a{
    background: #6C903D;
    padding: 0px 47px;
}
.header_btns li:last-child a:hover{
    background: #fff;
    color: #646464;
}
.header .promo_box{
	max-width:640px;
	margin:auto;
	background:#6C903D;
	padding:20px 30px;
	border-radius:15px;
}
.header .promo_box h2{
    font-weight: 700;
    font-size: 24px;
    line-height: 34px;
}
.header .promo_box h3{
    font-weight: 700;
    font-size: 20px;
    line-height: 34px;
}
.header .promo_box p{
    font-size: 14px;
    line-height: 1.5;
}
.header .promo_box p a{
	color:#fff;
	text-decoration:underline;
}
.top_cont{
    font-family: 'Poppins', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #4E3D39;
    padding: 56px 0px 72px;
}
.top_cont_in{
    max-width: 846px;
    width: 100%;
    margin: auto !important;
}
.top_cont h2{
	font-weight: 700;
	font-size: 24px;
	line-height: 34px;
	color: #4E3D39;

	margin: 0px 0px 24px;
}
.top_cont p{
    margin: 0px;
}
.top_cont p a{
    color:#4E3D39;
    text-decoration:underline;
}
.top_cont ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 64px;
}
.top_cont ul li a{
    display: block;
    width: 256px;
    font-family: 'Poppins', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 56px;
    text-align: center;
    color: #646464;
    background: #FFFFFF;
    border-radius: 16px;
}
.top_cont ul li.active a, .top_cont ul li a:hover{
    background: #6C903D;
    color: #fff;
}
.coffee_sec ul li{
    font-size: 18px;
    line-height: 28px;
    color: #4E3D39;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    margin-bottom:104px;
}
.coffee_sec ul li:nth-child(even){
    flex-direction:row-reverse;
}
.coffee_sec ul li:nth-child(even) .l_cont{
    padding:68px 104px 0px 0px;
}
.coffee_sec ul li h2{
    font-weight: 700;
    font-size: 24px;
    line-height: 34px;
    color: #4E3D39;
    margin: 0px 0px 24px;
}
.coffee_sec ul li .tags{
    font-size: 16px;
    line-height: 24px;
    color: #1E1E1E;
    margin-top: 48px;
}
.coffee_sec ul li .tags1{
    font-weight: 700;
    font-size: 18px;
    line-height: 28px;
    color: #4E3D39;
    margin-top: 24px;
    text-transform: uppercase;
}
.coffee_sec ul li figure{
    width: 222px;
    position:relative;
    padding:52px 0px;
}
.coffee_sec ul li figure:before{
    content: '';
    position: absolute;
    left: -2389px;
    top: 0px;
    background: #CFB0A5;
    opacity: 0.3;
    border-radius: 0px 24px 24px 0px;
    height: 100%;
    width: 2500px;
    z-index:-1;
}
.coffee_sec ul li.bg_gray figure:before{
    background: #928D8D;
}
.coffee_sec ul li.bg_maroon figure:before{
    background: #D47C89;
}
.coffee_sec ul li.bg_brown figure:before{
    background: #C6AA9F;
}
.coffee_sec ul li.bg_lightblue figure:before{
    background: #C8ABF1;
}
.coffee_sec ul li.bg_red figure:before{
    background: #984947;
}
.coffee_sec ul li.bg_green figure:before{
    background: #85B375;
}
.coffee_sec ul li.bg_orange figure:before{
    background: #C86A2B;
}
.coffee_sec ul li.bg_pink figure:before{
    background: #DB8BB0;
}
.coffee_sec ul li.bg_blue figure:before{
    background: #1D2151;
}
.coffee_sec ul li.bg_lightgray figure:before{
    background: #262E3E;
}
.coffee_sec ul li:nth-child(even) figure:before{
    left:110px;
    border-radius: 24px 0px 0px 24px;
}
.coffee_sec ul li figure:after{
    content:'';
    position:absolute;
    height: 6px;
    width: 152px;
    right: -41px;
    top: 47px;
    background: #6C903D;
}
.coffee_sec ul li:nth-child(even) figure:after{
    right:112px;
}
.coffee_sec ul li .l_cont{
    width: calc(100% - 222px);
    padding:68px 0px 0px 104px;
}
.coffee_sec{
    overflow:hidden;
}
.act_brands .add_btn a{
    display:block;
    max-width: 440px;
    width:100%;
    line-height: 56px;
    background: #6C903D;
    border-radius: 16px;
    font-weight: 600;
    font-size: 18px;
    color: #FAFAFA;
    text-align:center;
    margin:auto;
}
.act_brands .add_btn a:hover{
    background: #fff;
    color: #646464;
}
.act_brands ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 80px 0px -88px;
}
.footer{
    background: #1C0B07;
    padding-top: 32px;
    padding-bottom: 32px;
    font-family: 'Poppins', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    text-align: center;
    color: #FFFFFF;
    border-radius: 20px 20px 0px 0px;
}
.get-btn a{
    display: block;
    max-width: 200px;
    width: 100%;
    line-height: 56px;
    background: #6C903D;
    border-radius: 16px;
    font-weight: 600;
    font-size: 18px;
    color: #FAFAFA;
    text-align: center;
    margin: 20px auto auto;
}
.get-btn a:hover{
	background-color:#fff;

	color: #646464;
}
.footer .get-btn a{
    margin-top: 0;
    margin-bottom: 15px;
}
.get_start_form{
	padding-bottom:72px;
}
.get_start_form form{
	max-width:780px;
	margin:auto;
}
.get_start_form form .form_grid{
	display:flex;
	justify-content:space-between;
	align-items:flex-start;
}
.get_start_form form .form_grid p{
	max-width:calc(50% - 10px);
	min-width:calc(50% - 10px);
	margin-bottom:20px;
	position:relative;
}
.get_start_form form .form_grid p input{
	width:100%;
	padding:10px 15px;
	background:#DFD5D2;
	border:1px solid #937469;
	font-size:16px;
	color:#4E3D39;
	font-family:'Poppins', sans-serif;
	font-weight:400;
	line-height:20px;
}
.get_start_form form .form_grid p select{
	width:100%;
	padding:10px 15px;
	background:#DFD5D2;
	border:1px solid #937469;
	font-size:16px;
	line-height:20px;
	color:#4E3D39;
	font-family:'Poppins', sans-serif;
	font-weight:400;
	appearance:none;
	-webkit-appearance:none;
	-moz-appearance:none;
}
.get_start_form form .form_grid p.sel:after{
	position:absolute;
	content:'';
	width:12px;
	height:12px;
	border-right:1px solid #937469;
	border-bottom:1px solid #937469;
	right:18px;
	top:12px;
	z-index:10;
	transform:rotate(45deg);
	pointer-events: none;
}
.get_start_form form .form_grid p input::-webkit-input-placeholder { /* Edge */
	color:#4E3D39;
}
.get_start_form form .form_grid p input:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color:#4E3D39;
}
.get_start_form form .form_grid p input::placeholder {
	color:#4E3D39;
}
.get_start_form form .form_text,
.get_start_form form .form_sub{
	max-width:75%;
	margin-bottom:20px;
}
.get_start_form form .form_text textarea{
	width:100%;
	padding:10px 15px;
	background:#DFD5D2;
	border:1px solid #937469;
	font-size:16px;
	color:#4E3D39;
	font-family:'Poppins', sans-serif;
	font-weight:400;
	line-height:20px;
	resize:none;
	height:150px;
	overflow:auto;
	display:block;
}
.get_start_form form .form_text textarea::-webkit-input-placeholder { /* Edge */
	color:#4E3D39;
}
.get_start_form form .form_text textarea:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color:#4E3D39;
}
.get_start_form form .form_text textarea::placeholder {
	color:#4E3D39;
}
.get_start_form form .form_sub input,
.get_start_form form .form_sub button{
	width:100%;
	width:100%;
	padding:13px 15px;
	background:#937469;
	border:1px solid #937469;
	font-size:16px;
	color:#fff;
	font-family:'Poppins', sans-serif;
	font-weight:400;
	line-height:20px;
	cursor:pointer;
	appearance:none;
	-webkit-appearance:none;
	-moz-appearance:none;
}
.get_start_form form .form_sub input:hover,
.get_start_form form .form_sub button:hover{
	background:#DFD5D2;
	color:#4E3D39;
}

@media (max-width: 1439px) {
    .header_btns{
        right: -50px;
    }
}
@media (max-width: 1279px) {
.enclose{
	max-width: 960px;
}
.header_btns{
        right: 0px;
    }
.coffee_sec ul li .l_cont {
    padding: 68px 0px 0px 80px;
}
.coffee_sec ul li:nth-child(even) .l_cont {
    padding: 68px 80px 0px 0px;
}
.coffee_sec ul li h2 {
    font-size: 22px;
    line-height: 32px;
    }
.coffee_sec ul li .tags {
    margin-top: 35px;
}
}
@media (max-width: 991px) {
.enclose{
	max-width: 720px;
}
.top_cont ul li a {
    width: 230px;
    font-size: 15px;
    }
.coffee_sec ul li {
    font-size: 16px;
    line-height: 26px;
    margin-bottom: 70px;
    }
.coffee_sec ul li h2 {
    font-size: 20px;
    line-height: 28px;
    margin: 0px 0px 20px;
}
.header {
    font-size: 22px;
    line-height: 34px;
    }
.header_btns {
    justify-content: center;
    position: relative;
    }
}
@media (max-width:767px) {
.enclose{
	padding-left:24px;
	padding-right:24px;
}
    .header{
        padding: 8px 0px 56px;
        font-size: 16px;
        line-height: 24px;
    }
    .header .logo {
    margin:32px 0px 24px;
}
    .header_btns a{
        line-height: 40px;
        font-size: 14px;
        border-radius: 16px;
    }
    .header_btns li:last-child a {
    padding: 0px 40px;
}
.header_btns {
    justify-content: space-between;
    top: 0px;
}
    .top_cont{
        padding: 48px 0px;
    }
.top_cont ul li a {
    width: 100%;
    font-size: 16px;
    font-weight: 700;
}
    .top_cont ul li{
        margin-top: 8px;
    }
    .top_cont ul li:first-child{
        margin-top: 0px;
    }
.top_cont ul {
    display: block;
    margin-top: 48px;
    }
    .coffee_sec ul li{
        display: block;
    }
    .coffee_sec ul li figure {
    width: 100%;
    padding:0px;
    text-align: center;
}
.coffee_sec ul li .l_cont {
    width: 100%;
    }
    .coffee_sec ul li h2{
        font-size: 18px;
        line-height: 28px;
        margin: 24px 0px 16px;
    }
    .coffee_sec ul li {
    font-size: 14px;
    line-height: 24px;
        margin-bottom: 78px;
}
    .coffee_sec ul li:last-child{
        margin-bottom: 56px;
    }
    .coffee_sec ul li .tags {
    font-size: 14px;
        margin-top: 16px;
    }
    .coffee_sec ul li .tags1{
    font-size: 14px;
        line-height: 24px;
    }
    .coffee_sec ul li .l_cont, .coffee_sec ul li:nth-child(even) .l_cont {
    padding: 0px;
}
.act_brands ul {
    justify-content: center;
    margin:104px 0px -280px -18px;
    }
.act_brands ul li{
    width: calc(33.33% - 18px);
    margin-left: 18px;
    margin-bottom: 16px;
    }
.coffee_sec ul li figure:before, .coffee_sec ul li:nth-child(even) figure:before{
    left:-24px;
    width: calc(50% + 24px);
    top: -30px;
    border-radius: 0px 0px 0px 24px;
}
.coffee_sec ul li figure::after {
    left: 50%;
    right: inherit;
    width: 155px;
    }
.coffee_sec ul li figure::after {
    top: -6px;
    }
    .coffee_sec ul{
        padding-top: 30px;
    }
}
@media (max-width:540px) {
	.get_start_form form .form_grid{
		flex-wrap:wrap;
	}
	.get_start_form form .form_grid p {
		max-width: 100%;
		min-width: 100%;
	}
	.get_start_form form .form_text, .get_start_form form .form_sub {
		max-width: 100%;
		margin-bottom: 20px;
	}
}
@media (max-width:374px) {
	.enclose{
		padding-left:15px;
		padding-right:15px;
	}
	.coffee_sec ul li figure:after {
	    width: 145px;
	}
	.act_brands .add_btn a{
	    font-size: 16px;
	}
	.act_brands ul {
	    margin: 104px 0px -240px -18px;
	}
	.coffee_sec ul li figure:before, .coffee_sec ul li:nth-child(even) figure:before{
	    left:-15px;
	    width: calc(50% + 15px);
	}
}













/*********************/
