@font-face {
    font-family: 'latoheavy';
    src: url('../fonts/lato-heavy-webfont.woff2') format('woff2'),
         url('../fonts/lato-heavy-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'latosemibold';
    src: url('../fonts/lato-semibold-webfont.woff2') format('woff2'),
         url('../fonts/lato-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Medium.woff2') format('woff2'),
        url('../fonts/Lato-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
/*== common ==*/
* { margin: 0px; padding: 0px; text-decoration: none; border: none; box-sizing: border-box; list-style: none; border: none; /*transition: all 0.2s;*/}
body {font:18px 'productsans', sans-serif; overflow-x: hidden; color:#4D4D4D; }
.clearfix { display: block; }
.clearfix::after {content: ""; clear: both; display: table;}
a,a:hover,a:visited {text-decoration:none; outline:none !important;}
input:focus, select:focus {outline:none;}
h1, .h1, h2, .h2, h3, .h3 {margin:0px;}
#gift_a_story_content {background-color: #F5EAE6 !important; padding-bottom: 30px;}
.gift_a_story_wrapper {width: 1280px; margin: auto;}
.gift_a_story_container {padding: 10px; background: url("../images/ribbon.svg") no-repeat; background-position: left top -17px; position: relative;}
footer {margin-top: 0;}
/*== common ==*/
/*== home ==*/
.gift_story_icon {background: url("../images/gift_a_story_desktop.svg") no-repeat; position: absolute; left: 55px; top: 40px; width: 135px; height: 76px;}
.gift_credits {font: 13px/13px "Lato", sans-serif; color: #333333; text-align: center; font-weight: 700; position: relative; z-index: 99;}
.gift_credits div {background-color: #F5EAE6; padding: 8px 10px; display: inline-block;}
.gift_credits:before {content: ""; border-top: 1px dotted #FF8D45; height: 1px; display: block; margin: auto; left: 0; right: 0; top: 15px; z-index: -1; position: relative;}
.gift_credits_left {font: 16px/16px "Lato", sans-serif; color: #333333; font-weight: 400; text-align: center;}
.gift_credits_left span {font-weight: bold;}
.gift_date_block {font: 10px/12px "Lato", sans-serif; color: #999999; font-weight: 400;}
.gift_content {font: 18px/26px "latosemibold", sans-serif; color: #333333; margin: 10px 0;}
.gift_content a {text-decoration: underline; color: #333333; font: 18px/26px "latosemibold", sans-serif;}
.gift_content a:hover {text-decoration: none; color: #333333;}
.gift_receiver {font: 10px/12px "Lato", sans-serif; color: #999999; font-weight: 400;}
.gift_container {width: 490px; margin: auto;}
.gift_box {background: #FFFFFFE6 url("../images/gift_box_bg_desktop.svg") no-repeat right bottom -10px; border-radius: 5px; padding: 15px; margin-top: 60px; position: relative;} 
.gift_image_block img {max-width: unset;}
.orange_text {font: 12px/15px "Lato", sans-serif; color: #F26322; font-weight: 500;}
.gift_top_block {display: flex;}
.gift_bottom_block  {margin-top: 25px;}
.gift_image_block {margin-top: 28px;}
.gift_msg {font: 12px/18px "Lato", sans-serif; color: #666666; font-weight: 400; background-color: #F8F1EE; border: 1px solid #E5D5CD; padding: 10px; border-radius: 5px;}
.gift_msg input {background-color: transparent; width: 100%;}
.gift_msg_title {font: 12px/12px "Lato", sans-serif; color: #333333; font-weight: 400; margin-bottom: 7px;}
.gift_msg_box {margin: 25px auto auto auto;}
.send_gift {background-color: #652900; border-radius: 25px; width: 290px; display: block; margin: 30px auto 10px; text-align: center; padding: 15px 10px; font: 14px/14px "Lato", sans-serif; color: #FFFFFF; font-weight: 400; text-transform: uppercase;}
.send_gift:hover {background-color: #333333;}
.send_gift:focus {color: #FFFFFF; text-decoration: none;}
.send_gift:hover {color: #fff; text-decoration: none;}
.nonsubscriber {font: 12px/15px "Lato", sans-serif; color: #333333; font-weight: 400; text-align: center;}
.nonsubscriber span {color: #F26322; font-weight: 700;}
.nonsubscriber a span:hover {color: #333;}
.how_this_works {font: 12px/15px "latosemibold", sans-serif; color: #333333; font-weight: normal; border-radius: 30px; background-color: #E1C2B5; width: 115px; display: block; margin: auto; padding: 5px 10px; text-align: center; margin-top: 20px;}
.how_this_works:hover {background-color: #333333; text-decoration: none; color: #fff;}
.gift_boxes {text-align: center; margin-top: 5px; margin-bottom: 15px;}
.gift_box_ribbon {background: url("../images/gift_box_ribbon.svg") no-repeat; position: absolute; width: 269px; height: 60px; left: 0; right: 0; margin: auto; top: -37px;}
.gift_boxes li.used {background: #E1C2B5 url("../images/gift-box_used.svg") no-repeat; width: 28px; height: 28px; border-radius: 100%; display: inline-block; vertical-align: top; background-position: top 4px center;}
.gift_boxes li.unused {background: #FF8D45 url("../images/gift-box_left.svg") no-repeat; width: 28px; height: 28px; border-radius: 100%; display: inline-block; vertical-align: top; background-position: top 6px left 7px;}
.gift_content_block {width: 80%;}
/*== home ==*/
/*== popup ==*/
body.modal-open .modal[style]:not([style='display: none;']) {
    display: flex !important;
    height: 100%;
} 

body.modal-open .modal[style]:not([style='display: none;']) .modal-dialog {
    margin: auto;
}
.giftpopup .modal-dialog {background: #F5EAE6 url("../images/ribbon.svg") no-repeat; border-radius: 10px; width: 550px;}
.giftpopup .modal-content {background-color: transparent;}
.giftpopup .modal-body {padding: 100px; text-align: center;}
#send_gift_popup.giftpopup .modal-body{padding: 50px 100px 100px;}
.giftpopup .modal-header {border-bottom: 0;}
.giftpopup .modal-footer {border-top: 0;}
.giftpopup p {font: 14px/20px "Lato", sans-serif; color: #333333; font-weight: 700;}
.share_on_whtsapp {margin: 20px 0 5px; display: block;}
.share_on_whtsapp .a {display: block; fill: #3aa334; stroke: none;}
.share_on_email .a {display: block; fill: #3564e5; stroke: none}
.giftpopup .close, .giftpopup .close:hover {opacity: 1;}
.giftpopup ul li {font: 14px/20px "Lato", sans-serif; color: #333333; font-weight: 400; margin-bottom: 20px; text-align: left;}
.terms_and_conditions {background-color: #F1E1DA; padding: 20px 0; border-radius: 0px 0px 10px 10px;}
.terms_and_conditions ul li {font: 12px/16px "Lato", sans-serif; color: #666666; font-weight: 400; margin-bottom: 15px; list-style-type: decimal; padding-left: 10px;}
.terms_and_conditions ul li::marker {margin-right: 10px;}
.terms_and_conditions p {font: 12px/13px "Lato", sans-serif; color: #333333; font-weight: 700; margin-bottom: 10px; padding-left: 40px; text-align: left;}
#how_this_works_popup .modal-body {padding: 0;}
#how_this_works_popup ul {padding: 10px 115px 0;}
#how_this_works_popup ul li div {overflow: hidden;}
#how_this_works_popup .terms_and_conditions ul {padding: 0 50px;}
.gift_claim {background: url("../images/gift-claim.svg") no-repeat; width: 22px; height: 27px; float: left; margin-right: 15px;}
.friends {background: url("../images/friends.svg") no-repeat; width: 26px; height: 19px; float: left; margin-right: 15px;}
.click_signup {background: url("../images/click-signup.svg") no-repeat; width: 19px; height: 29px; float: left; margin-right: 20px;}
.click {background: url("../images/click.svg") no-repeat; width: 30px; height: 27px; float: left; margin-right: 15px;}
#how_this_works_popup .modal-header p {font-size: 20px; line-height: 24px; text-align: center;}
/*== popup ==*/
/*== gift claimer ==*/
.mcpro_logo {text-align: center; margin: 20px 0;}
.giftclaimer_name {font: 20px/20px "latoheavy", sans-serif; color: #333333; font-weight: normal; text-align: center;}
.byline {font: 14px/19px "Lato", sans-serif; color: #333333; font-weight: 400; text-align: center; margin-top: 5px;}
.byline span {font-weight: 700;}
.byline .orange {color: #F26322;}
.gift_claimer .gift_box {margin-bottom: 20px;}
.gift_claimer .nonsubscriber {}
.gift_claimer .send_gift {margin: 15px auto 15px;}
.nonsubscriber a {text-decoration: underline; color: #F26322;}
.gift_a_story_container.gift_claimer {padding-top: 15px;}
/*== gift claimer ==*/
/*== gifted stories ==*/
.gifted_stories .section_title {font: 18px/13px "Lato", sans-serif; color: #333333; font-weight: 700; text-align: center; margin: 30px 0;}
.gifted_stories .gift_container {width: 930px; margin-top: 5px;}
.gifted_stories .gift_box_title {font: 14px/13px "latoheavy", sans-serif; color: #333333; font-weight: 700; margin-bottom: 10px;}
.gifted_stories .gift_box {margin-top: 5px; background-position: right bottom -70px; margin-bottom: 7px;}
.gifted_stories .copy_gift {font: 14px/17px "latosemibold", sans-serif; color: #F26322; font-weight: normal; padding-bottom: 0px; display: block;
    text-align: right;}
.gifted_stories .claimed_by {font: 12px/15px "Lato", sans-serif; color: #F26322; font-weight: 400;}
.gifted_stories .claimed_by span {color: #999999;}
.gift_group {margin-bottom: 40px;}
/*== gifted stories ==*/
.MT15.main-wrapper.mob-hide {display: none;}
.gift_msg textarea {width: 100%; resize: none; padding: 10px;}
@media only screen and (max-width: 1279px){
	.gift_a_story_wrapper {width: auto; padding: 0 15px;}
	.gift_container {width: auto;}
}
@media only screen and (max-width: 767px){
	.gift_a_story_container {margin-left: -15px; margin-right: -15px; background-position: left -80px top -30px;}
	.gift_story_icon {position: static; margin: auto; width: 100px; height: 55px; background-size: contain;}
	.gift_credits_left {font-size: 12px; line-height: 16px;}
	.gift_credits {font-size: 10px; line-height: 13px;}
	.gift_date_block {font-size: 9px;}
	.gift_content {font-size: 13px; line-height: 17px;}
	.gift_image_block {margin-top: 23px;}
	.gift_image_block img {width: 85px; height: 50px;}
	.orange_text {font-size: 10px; line-height: 12px;}
	.gift_msg_title {font-size: 10px; line-height: 13px;}
	.gift_msg {font-size: 11px; line-height: 18px;}
	.send_gift {font-size: 11px; line-height: 13px; width: auto;}
	.nonsubscriber {font-size: 10px; line-height: 12px;}
	.how_this_works {font-size: 10px; line-height: 12px;}
	.giftpopup .modal-dialog {width: auto; background-position: top -55px left -70px; margin-top: 60px;}
	.giftpopup .modal-body {padding: 15px 35px 35px 35px;}
	#send_gift_popup.giftpopup .modal-body{padding: 15px 35px 35px 35px;}
	#how_this_works_popup .modal-header p {font-size: 14px; line-height: 14px;}
	#how_this_works_popup ul {padding: 10px 25px 0;}
	.giftpopup ul li {font-size: 12px; line-height: 17px;}
	.terms_and_conditions ul li {font-size: 11px; line-height: 15px;}
	#how_this_works_popup .terms_and_conditions ul {padding: 0 35px;}
	.giftclaimer_name {font-size: 16px; line-height: 19px;}
	.byline {font-size: 13px; line-height: 19px;}
	.gifted_stories .gift_container {width: auto;}
	.gifted_stories .section_title {font-size: 14px; line-height: 13px;}
	.gifted_stories .gift_box_title {font-size: 12px; line-height: 13px;}
	.gifted_stories .copy_gift {font-size: 10px; line-height: 12px;}
	.gifted_stories .gift_content {font-size: 12px; line-height: 17px;}
	.gift_credits:before {width: 75%;}
	.terms_and_conditions p {padding-left: 23px;}
}