/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

/** BUG FIX - IOS general overflow + Single Product Gallery - Issues **/
@media screen and (min-width: 850px) {
.vertical-thumbnails {overflow-x: hidden;overflow-y: overlay;}
}
html, body {max-width: 100%;overflow-x: hidden;}
.width-110 .row-full-width {    max-width: 110% !important;}

/** GENERAL STYLING **/
.pink {color:#EF4480;}
.turquoise {color:#42A9C5;}
.green {color:#4FB295;}
.blue {color:#2493C4;}
.grey {color:#676767;}
.yellow {color:#FFF8E1;}

.pink a.button.open-video.icon.circle.is-outline, .pink i.icon-play {color:#EF4480;}
.pink i.icon-play:hover {color:#fff!important;}

.dark, .dark p, .dark td {color: #fff;}

h2 {line-height:1.5em!important;}
button {border-radius:99px!important;text-transform:capitalize!important;}
.white-bg-row {background: white;}
.home-hover-col > .col-inner:hover {
    background-image: linear-gradient(to top, #f5f2df , white)!important;
}
a.black-title-link  {color:inherit;}
a.black-title-link:hover {color:#EF4480;}

.absolute-footer {display:none;}

@media only screen and (min-width: 48em) {div#get-a-quote {width: 800px;}}
@media only screen and (max-width: 48em) {div#get-a-quote {width: 100%;}}

.slider-nav-light .flickity-page-dots .dot.is-selected {
    background-color: #EF4480;
}

/** TOP BAR MENU **/
.top-bar-nav li a {
    color: #EF4480;
    padding: 0 25px;
    font-weight: bold!important;
}
.light-pink-bg {
    background: #F7E0DA;
}
.top-bar-nav li {
    min-height: 40px!important;
    padding-top: 4px;
}
#top-bar .container {
    padding: 0!important;
}

/** MAIN MENU **/
#logo {
    width: 169px;
    margin: 0 5%;
}

/** HEADER SECTION TITLES **/
@media only screen and (min-width: 48em) {
.hearder-sub-title {font-size: 250%;font-weight: bold;line-height: 1em;margin: 15px 0;}
.header-title {font-size: 440%;font-weight: bold;line-height: 0.9em;}
}
@media only screen and (max-width: 48em) {
.hearder-sub-title {font-size: 200%;font-weight: bold;line-height: 1.2em;margin: 15px 0;}
.header-title {font-size: 290%;font-weight: bold;line-height: 1em;}
}

/** GET A QUOTE **/
@media only screen and (min-width: 48em) {
div#get-a-quote {padding: 20px 60px 20px 70px!important;}
}
@media only screen and (max-width: 48em) {
div#get-a-quote {padding: 20px 5% 20px 5%!important;}
}

/** WORKSHOPS PAGE **/
.col-opacity-5 {opacity: 0.2;}
.col-opacity-5:hover {opacity: 1;}
@media only screen and (min-width: 48em) {
.workshops-box-centered {max-width: 100%;}
}
@media only screen and (max-width: 48em) {
.workshops-box-centered {max-width: 110%;}
}
.workshops-box-centered .box-text-inner {line-height: 1.3em;}

/** FOOTER **/
.footer-menu {
    list-style:none;
    margin:0;
    padding:0;
    text-align:center;
}
.footer-menu li{
    display:inline;
	line-height: 1em;
}
.footer-menu a{
    display:inline-block;
    padding:10px;
}
ul.footer-menu > li:first-of-type {
    margin-left: 0;
}

/** TEXT ROTATOR **/

.rotator-slide {
  position: relative;
  list-style: none;
  text-align: left;
  padding: 0;
  margin-bottom:60px;
  margin-top:-15px
}
.rotator-slide > span {
  position: absolute;
  opacity: 0;
  width: 100%;
}
.rotator-slide > span:first-child {
  -webkit-animation: loop1 15s infinite;
}
.rotator-slide > span:nth-child(2) {
  -webkit-animation: loop2 15s infinite;
}
.rotator-slide > span:nth-child(3) {
  -webkit-animation: loop3 15s infinite;
}
.rotator-slide > span:nth-child(4) {
  -webkit-animation: loop4 15s infinite;
}
.rotator-slide > span:nth-child(5) {
  -webkit-animation: loop5 15s infinite;
}
.rotator-slide > span:last-child {
  -webkit-animation: loop6 15s infinite;
}


@-webkit-keyframes loop1 {
  0% { opacity: 0; }
  15% { opacity: 1;transform: translateX(0px); }
  30% { opacity: 0;transform: translateX(550px); }
}
@-webkit-keyframes loop2 {
  15% { opacity: 0; }
  30% { opacity: 1;transform: translateX(0px); }
  45% { opacity: 0;transform: translateX(550px); }
}
@-webkit-keyframes loop3 {
  30% { opacity: 0; }
  45% { opacity: 1;transform: translateX(0px); }
  60% { opacity: 0;transform: translateX(550px); }
}
@-webkit-keyframes loop4 {
  45% { opacity: 0; }
  60% { opacity: 1;transform: translateX(0px); }
  75% { opacity: 0;transform: translateX(550px); }
}
@-webkit-keyframes loop5 {
  60% { opacity: 0; }
  75% { opacity: 1;transform: translateX(0px); }
  100% { opacity: 0;transform: translateX(550px); }
}
@-webkit-keyframes loop6 {
  75% { opacity: 0; }
  100% { opacity: 1;transform: translateX(0px); }
  115% { opacity: 1;transform: translateX(0px); }
  130% { opacity: 0;transform: translateX(550px); }
}

/** TIMELINE **/
.section-title b {
    display: block;
    -ms-flex: 1;
    flex: 1;
    height: 1px;
    opacity: 1;
    background-color: #ef4480;
}
h3.section-title.section-title-center {
    margin-bottom: 0;
}
@media screen and (max-width: 1200px) and (min-width: 550px) {
.special-responsive {
    max-width: 33%;
    -ms-flex-preferred-size: 33%;
    flex-basis: 33%;
}
}

/** ABOUT US ACHIEVEMENTS **/
.achievement-bg-1 {
    background: url(https://artse.sg/wp-content/uploads/2019/09/Achievements-logo-1.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
	padding:20px;
	min-height: 130px;
}
.achievement-bg-2 {
    background: url(https://artse.sg/wp-content/uploads/2019/09/Achievements-logo-2.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
	padding:45px 20px;
	min-height: 130px;
}
.achievement-bg-3 {
    background: url(https://artse.sg/wp-content/uploads/2019/09/Achievements-logo-3.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
	padding:20px;
	min-height: 130px;
}

/** ABOUT US ARTISTS **/
@media only screen and (min-width: 940px) {
.artists-width-col {
    max-width: 20%;
    -ms-flex-preferred-size: 20%;
    flex-basis: 20%;
	margin-bottom: 20px;
}
}
@media only screen and (max-width: 940px) {
.artists-width-col {
    max-width: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
	margin-bottom: 20px;
}
}
/** GRAVITY FORM STYLING **/
body .gform_wrapper ul li.gfield {margin-top:0px!important;}
body .gform_wrapper .top_label div.ginput_container {margin-top:0px!important;}
.gform_wrapper .field_sublabel_hidden_label .ginput_complex.ginput_container input[type=text], .gform_wrapper .field_sublabel_hidden_label .ginput_complex.ginput_container select {
    margin-bottom: 1em!important;
}

::placeholder {
    color: #7c7c7c;
    font-weight: bold;
}

input, textarea, fieldset {
    margin-bottom: 1em;
    background: #efefef!important;
    color: #000!important;
	font-weight: bold;
}
select {
    margin-bottom: 1em;
    color: #000!important;
    background-color: #efefef;
    padding-left: 10px!important;
    font-weight: bold;
}

.gform_wrapper.gf_browser_chrome .gfield_checkbox li input[type=checkbox],.gform_wrapper.gf_browser_chrome ul.gform_fields li.gfield input[type=radio],.ginput_container_consent input {
    width: 25px!important;
    height: 25px!important;
    margin-bottom: 2px;
}

.gform_wrapper li.hidden_label input {
    margin-top: 0px!important;
}
.gform_wrapper textarea.medium {
    height: 120px!important;
    width: 100%!important;
}
.gform_wrapper .gform_footer {
    padding: 0px 0 10px!important;
    margin: 0px 0 0!important;
}
.gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]) {
	padding:5px 4px 5px 10px!important;
}
.address_country {width: 100%!important;padding-right: 0px!important;}
.address_country select {padding-left: 7px!important;}


div.gform_footer.top_label {text-align: center !important;margin-top:25px!important;}

input[type=submit] {background: #ef4480!important;color: #fff!important;border-radius:99px;}

.gform_wrapper div.validation_error {
    color: #FB4D3D;
    border-top: 2px solid #FB4D3D;
    border-bottom: 2px solid #FB4D3D;
}
.gform_wrapper .validation_message {color: #FB4D3D;}

.gform_wrapper li.gfield.gfield_error, .gform_wrapper li.gfield.gfield_error.gfield_contains_required.gfield_creditcard_warning {
    background-color: inherit;
    margin-bottom: 40px!important;
    border-top: inherit;
    border-bottom: inherit;
    padding-bottom: inherit;
    padding-top: inherit;
}
.gform_wrapper .field_description_below .gfield_description {
    padding-top: inherit;
}
.gform_wrapper li.gfield_error input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), .gform_wrapper li.gfield_error textarea {
    border: 2px solid #FB4D3D;
}
.ginput_container_consent > input {vertical-align: middle!important;}

input.datepicker {width: calc(100% - 40px)!important}
body .gform_wrapper img.ui-datepicker-trigger {
    width: 30px!important;
    height: 34px!important;
    display: -moz-inline-stack;
    display: inline-block;
    margin-top:-20px;
}
.ui-datepicker {background: #fff!important;}
.ui-datepicker table {border-color: #fff!important;}
.ui-datepicker tbody tr, .ui-datepicker thead {border-bottom: inherit!important;}
.ui-datepicker th {color: #fff!important;text-shadow: none!important;}
.ui-datepicker tbody td {border-top: 0px!important;border-right: 0px!important;border-left: 0px!important;border-bottom: 0px!important;}
.ui-datepicker thead {background: #ef4480!important;}
td.ui-datepicker-unselectable.ui-state-disabled {background-color: #fff!important;}
.ui-datepicker-calendar .ui-state-default {background: #fff!important;}
.ui-datepicker-calendar, .ui-state-default {box-shadow: inherit!important;}
td.ui-datepicker-days-cell-over.ui-datepicker-today > a, a.ui-state-default.ui-state-active {
    background-color: #ef4480!important;
    color: #fff!important;
    text-shadow: none!important;
    border-radius: 99px!important;
	border:inherit!important;
}
.ui-datepicker-calendar .ui-state-default:hover {
    background-color: #ef4480!important;
    color: #fff!important;
    text-shadow: none!important;
    border-radius: 99px!important;
}
select.ui-datepicker-month {
    width: 65px!important;
    float: left!important;
    margin-right: 10px;
    margin-left: 7px;
	background-color: #fff!important;
    border: 0;
}
select.ui-datepicker-year {width: 65px!important;float: left!important;background-color: #fff!important;border:0;}

.ui-datepicker-header {background-color: #ef4480!important;min-height: 47px!important;height:48px!important;}
    
.gform_wrapper .top_label li.gfield.gf_inline input[type=text].datepicker.medium {
    width: 136px!important;
}
.gf_inline select {
    min-width: 170px!important;
}




@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}