/*
Theme Name:  SVFX
Theme URI:   www.svfx.in
Version:     1.0
Description:  SVFX Animation Studio.
Author:      SVFX
Author URI:  www.svfx.in
Template:    Divi
*/


/***********************************************************************
Caution: do not remove this to keep Divi Children Engine always updated 
Divi Children Engine version: 1.0.4
***********************************************************************/

/*------------------------------[FONT ICONS]-----------------------------*/
/*--[Created by Divi Children, http://divi4u.com/divi-children-plugin/]--*/
/*-----------------------------------------------------------------------*/

.icon_tags, .icon_profile, .icon_chat, .icon_clipboard, .icon_calendar {
	font-family: 'ETmodules';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-size: 16px;
	color: #318EC3;
}
.icon_tags:before {
	content: "\e07c";
	padding: 0px 5px 0 0;
}
.icon_profile:before {
	content: "\e08a";
	padding: 0 5px 0 0;
}
.icon_chat:before {
	content: "\e066";
	padding: 0 5px 0 20px;
}
.icon_clipboard:before {
	content: "\e0e6";
	padding: 0 5px 0 20px;
}
.icon_calendar:before {
	content: "\e023";
	padding: 0 5px 0 20px;
}

/*- YOU CAN INCLUDE THE CUSTOM CODE FOR YOUR CHILD THEME BELOW THIS LINE-*/

/*------------------------------------------------*/
/*-----------------[BASIC STYLES]-----------------*/
/*------------------------------------------------*/



/*------------------------------------------------*/
/*---------------[MAIN LAYOUT INFO]---------------*/
/*------------------------------------------------*/



/*------------------------------------------------*/
/*---------------[DROPDOWN MENU]------------------*/
/*------------------------------------------------*/



/*------------------------------------------------*/
/*-------------------[COMMENTS]-------------------*/
/*------------------------------------------------*/



/*------------------------------------------------*/
/*---------------------[FOOTER]-------------------*/
/*------------------------------------------------*/



/*------------------------------------------------*/
/*--------------------[SIDEBAR]-------------------*/
/*------------------------------------------------*/



/*------------------------------------------------*/
/*------------[CAPTIONS AND ALIGNMENTS]-----------*/
/*------------------------------------------------*/



/*------------------------------------------------*/
/*-----------------[WP CALENDAR]------------------*/
/*------------------------------------------------*/



/*------------------------------------------------*/
/*-------------------[PAGE NAVI]------------------*/
/*------------------------------------------------*/



/*------------------------------------------------*/
/*------------------[TRANSITIONS]-----------------*/
/*------------------------------------------------*/



/*------------------------------------------------*/
/*---------------[RESPONSIVE LAYOUTS]-------------*/
/*------------------------------------------------*/

@media only screen and ( min-width: 981px ) {

}

/*-------------------[960px]------------------*/
@media only screen and ( min-width: 981px ) and ( max-width: 1100px ) {

	/*-------------------[Sliders]------------------*/

	/*-------------------[Portfolio]------------------*/

	/*-------------------[Sidebar]------------------*/
	
	/*-------------------[Menu]------------------*/
	
}

/*-------------------[768px]------------------*/
@media only screen and ( max-width: 980px ) {

	/*-------------------[Portfolio]------------------*/
	
	/*-------------------[Sliders]------------------*/
	
	/*-------------------[Menu]------------------*/

}

@media only screen and ( min-width: 768px ) and ( max-width: 980px ) {

}

@media screen and ( max-width: 782px ) {

}

/*-------------------[480px]------------------*/
@media only screen and ( max-width: 767px ) {

	/*-------------------[Menu]------------------*/

}

/*-------------------[320px]------------------*/
@media only screen and ( max-width: 479px ) {

}


/*------------------- CF 7 Styling------------------*/

.wpcf7-text, .wpcf7-textarea, .wpcf7-captchar, .wpcf7-email, .wpcf7-number, .wpcf7-select {
background-color: #fff !important;
border: none !important;
width: 100% !important;
-moz-border-radius: 0 !important;
-webkit-border-radius: 0 !important;
border-radius: 8px !important;
font-size: 14px;
color: #757575 !important;
padding: 12px !important;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
	-webkit-box-shadow: 1px 1px 3px 1px #0e0d0d66;
	}
.wpcf7-submit {

	
	
	cursor: pointer;
	    background-color: #f3b42c;
    font-weight: 700;
    text-transform: uppercase;
    color: #ffffff !important;
    font-size: 22px !important;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border-width: 0px;
    border-color: #333;
    border-style: solid;
    transition-property: background-color;
    transition-duration: 300ms;
    transition-timing-function: ease;
    transition-delay: 0ms;
	padding-top: 16px !important;
    padding-right: 105px !important;
    padding-bottom: 16px !important;
    padding-left: 105px !important;
	    width: 100%;
}
.wpcf7-submit:hover {  
	    background-color: #292b7a;
	padding-top: 16px !important;
    padding-right: 105px !important;
    padding-bottom: 16px !important;
    padding-left: 105px !important;
}
.wpcf7-form > p {
     padding-bottom: 1.0em !important;
}

#mobile {

background-color: #fff !important;
border: none !important;
width: 100% !important;
-moz-border-radius: 0 !important;
-webkit-border-radius: 0 !important;
border-radius: 10px !important;
font-size: 14px;
color: #999 !important;
padding: 10px !important;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

/*------------------- Footer youtube icon------------------*/

.et-social-youtube a.icon:before { content: '\e0a3'; }
.et-social-linkedin a.icon:before { content: '\E09D'; }


@media only screen and (min-width: 981px) {
    #logo {

/* 		 background-color: white;
        border-radius: 10px; */
		 max-height: 130% !important;
/* 		padding: 4px; */
    }
}

/* img.wp-image-612 {
    border-radius: 10px;
} */

 @media (max-width: 980px) {
   #logo {
    max-height: 120%;
	    background-color: white;
        border-radius: 10px;
	   padding: 2px;
}
} 

@media only screen and (max-width: 980px) {
    a, .mobile_menu_bar:before,{
        color: rgb(243 180 44) !important;
    }
}

.box_shadow:hover {
    background-color: #FFFFFF !important;
    border-style: solid !important;
    border-color: #FFFFFF !important;
    box-shadow: 0px 40px 40px 0px rgb(0 0 0 / 10%) !important;
    transform: translateY(-5px) !important;
    transition: all .3s ease-in-out !important;
}

.table-container {
  width: 200%;
  overflow-x: auto;
}

table {
  width: 100%;
}
.entry-content tr td {
    border-top: 1px solid #293181;

}
.entry-content table:not(.variations) {
    border: 1px solid #292b7a;
}

button#wcdp-ajax-button {
    background-color: #f3b42c;
    font-weight: 700;
    text-transform: uppercase;
    color: #ffffff !important;
    font-size: 20px !important;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border-width: 0px;
    border-color: #333;
    border-style: solid;
    transition-property: background-color;
    transition-duration: 300ms;
    transition-timing-function: ease;
    transition-delay: 0ms;
    padding-top: 16px !important;
    padding-right: 75px !important;
    padding-bottom: 16px !important;
    padding-left: 75px !important;
}

button#wcdp-ajax-button:hover {  
	    background-color: #292b7a;
	 padding-top: 16px !important;
    padding-right: 75px !important;
    padding-bottom: 16px !important;
    padding-left: 75px !important;
}


button.button.wcdp-button.wcdp-left  {
	background-color: #f3b42c;
    font-weight: 700;
    text-transform: uppercase;
    color: #ffffff !important;
    font-size: 20px !important;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border-width: 0px;
    border-color: #333;
    border-style: solid;
    transition-property: background-color;
    transition-duration: 300ms;
    transition-timing-function: ease;
    transition-delay: 0ms;
    padding-top: 16px !important;
    padding-right: 55px !important;
    padding-bottom: 16px !important;
    padding-left: 55px !important;
}
button.button.wcdp-button.wcdp-left:hover {  
	    background-color: #292b7a;
    padding-top: 16px !important;
    padding-right: 55px !important;
    padding-bottom: 16px !important;
    padding-left: 55px !important;
	    color: white !important;
}
button.button.wcdp-button.wcdp-right {
		background-color: #f3b42c;
    font-weight: 700;
    text-transform: uppercase;
    color: #ffffff !important;
    font-size: 20px !important;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border-width: 0px;
    border-color: #333;
    border-style: solid;
    transition-property: background-color;
    transition-duration: 300ms;
    transition-timing-function: ease;
    transition-delay: 0ms;
    padding-top: 16px !important;
    padding-right: 55px !important;
    padding-bottom: 16px !important;
    padding-left: 55px !important;
}
button.button.wcdp-button.wcdp-right:hover {  
	    background-color: #292b7a;
    padding-top: 16px !important;
    padding-right: 55px !important;
    padding-bottom: 16px !important;
    padding-left: 55px !important;
}

input#wcdp_1_wcdp-range {
    background: #6464646e;
    border-radius: 10px;
    width: 261px;
    margin-top: 10px;
}

button.button.wcdp-left {
    background-color: var(--gcid-k59j9uo8wt);
    font-weight: 700;
    text-transform: uppercase;
    color: #ffffff !important;
    font-size: 20px !important;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border-width: 0px;
    border-color: #333;
    border-style: solid;
    transition-property: background-color;
    transition-duration: 300ms;
    transition-timing-function: ease;
    transition-delay: 0ms;
    padding-top: 16px !important;
    padding-right: 55px !important;
    padding-bottom: 16px !important;
    padding-left: 55px !important;
	border: 0px solid transparent;
   
}

button.button.wcdp-left:hover {  
	    background-color: #ffffff;
    padding-top: 16px !important;
    padding-right: 55px !important;
    padding-bottom: 16px !important;
    padding-left: 55px !important;
	 color: #000000 !important;
	 }
.woocommerce .woocommerce-error, .woocommerce .woocommerce-info, .woocommerce .woocommerce-message {
    background: #292b7a;
}
.wcdp-button, .wcdp-form butt on {
    padding: 0px 0px;
}
.woocommerce .woocommerce-error .button, .woocommerce .woocommerce-info .button, .woocommerce .woocommerce-message .button, .woocommerce-page .woocommerce-error .button, .woocommerce-page .woocommerce-info .button, .woocommerce-page .woocommerce-message .button {
    float: none;
}
.wcdp-body input.wcdp-donation-amount {
    border-radius: 6px;
}
label.required_field {
    color: black !important;
}
.woocommerce form .form-row input.input-text {
    -webkit-appearance: none;
    background-color: #eeeeee00;
    max-width: 100%;
    border-width: 1px;
    border-radius: 3px;
    color: #999;
    font-size: 14px;
    padding: .5em;
    line-height: 1.7em;
    border-style: solid;
    border-color: black;
}


a.et-cart-info {
    display: none;
}

.mobile_menu_bar:before {
    color: #f3b42c !important;
}



/* Mobile Menu CSS */


/* when mobile menu is open, change hamburger icon to x icon */

#et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::before {
    content: '\4d';
}
/* makes sub sub menu icon be right arrow instead of down arrow */

#top-menu .menu-item-has-children .menu-item-has-children > a:first-child::after,
#et-secondary-nav .menu-item-has-children .menu-item-has-children > a:first-child::after {
    content: '5';
}
/* - mobile menu toggling elements, injected via jQuery - */
/* make menu list item be relative, to be able to position toggle within this item */

#main-header #mobile_menu.et_mobile_menu .menu-item-has-children {
    position: relative;
}
/* the new toggle element, which is added via jQuery */

#main-header #mobile_menu.et_mobile_menu .sub-menu-toggle {
    position: absolute;
    z-index: 1;
    width: 36px;
    height: 36px;
    line-height: 36px;
    border-radius: 50%;
    top: 10px;
    right: 35px;
    cursor: pointer;
    text-align: center;
}
/* the new toggle element when popped */

#main-header #mobile_menu.et_mobile_menu .sub-menu-toggle.popped {
    background-color: rgba(255,255,255, 0.2);
}
/* toggle icon */

#main-header #mobile_menu.et_mobile_menu .sub-menu-toggle::before {
    font-family: "ETmodules" !important;
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 36px;
    font-size: 24px;
    text-transform: none;
    speak: none;
    content: '\33';
    color: #fff;
}
/* toggle icon when triggered */

#main-header #mobile_menu.et_mobile_menu .sub-menu-toggle.popped::before {
    content: '\32';
}
/* hide sub menus by default */

#main-header #mobile_menu.et_mobile_menu .sub-menu-toggle ~ ul.sub-menu {
    display: none !important;
    padding-left: 0;
}
/* show sub menu when triggered via jQuery toggle, and add slight bg color */

#main-header #mobile_menu.et_mobile_menu .sub-menu-toggle.popped ~ ul.sub-menu {
    display: block !important;
}
/* remove sub menu list item left padding, since padding will be on anchors */

#main-header #mobile_menu.et_mobile_menu li li {
    padding-left: 0;
}
/* adjust mobile menu anchors side paddings */

#main-header #mobile_menu.et_mobile_menu li a {   
    padding-right: 20px;
}

/* indent sub sub menus further */

#main-header #mobile_menu.et_mobile_menu li li li a {
    padding-left: 60px;
    padding-right: 20px;
}

#main-header #mobile_menu.et_mobile_menu .menu-item-has-children > a {
   
    font-weight: inherit;
}
/* make the current page's mobile menu link be different */

#main-header #mobile_menu.et_mobile_menu li.current-menu-item > a {
    font-weight: bolder;
}

/****** Code Style: Menu slide-in with background image ******/

/* Font Awesome */
.fa {
    margin-right: 15px ;
  }

@media only screen and (max-width: 980px){
#mobile_menu {
    display: block !important;
    min-height: 100vh;
    height: 100%;
    top: 0;
    right: 0;
    position: fixed;
    z-index: 9998;
    overflow: scroll;
    border-top: none;
    padding-top: 60px !important;
}

.et_mobile_menu li a {
    color: #fff !important;
    width: 100%;
    float: left;
    border: none !important;
    text-align: left;
    margin: 4px 4px;
    transition: .2s;
    text-transform: uppercase;
    font-size: 15px !important;
}
.sub-menu li a{
    font-size: 1em !important;
    }
.mobile_nav ul#mobile_menu .current_page_item > a {
    color: #f3b42c !important;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 30px;
    padding-left: 20px;
}

.mobile_nav.closed #mobile_menu {
      -moz-background-size: cover;
    -o-background-size: cover;
    -webkit-background-size: cover;
    background: linear-gradient(
      rgba(66, 66, 66, 0.50),
      rgba(66, 66, 66, 0.90)
    ), /* ------ Here you can customize the overlay effect by adding the color you want in rgba format. NOTE: adding two colors you can create a gradient effect  ----- */

    url(""); /* ----- Add here the url of the image you want as background ----- */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: -webkit-transform 0.4s 0s;
    -moz-transition: -moz-transform 0.4s 0s;
    transition: transform 0.4s 0s;
}

.mobile_nav.opened #mobile_menu {
      -moz-background-size: cover;
    -o-background-size: cover;
    -webkit-background-size: cover;
    background: linear-gradient(#292b7afa, #292b7aed), url(style.css?ver=5.0.0-public-beta.8);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -webkit-overflow-scrolling: touch;
    -webkit-transition: -webkit-transform 0.4s 0s;
    -moz-transition: -moz-transform 0.4s 0s;
    transition: transform 0.4s 0s;
}


.mobile_menu_bar:before {
    color: #1b1d1e !important;
}
.mobile_nav.opened .mobile_menu_bar:before {
    content: '\4d';
    z-index: 9999;
    color: #fff !important;
    border: 1px solid #fff;
    width: 30px;
    height: 30px;
    margin-right: 20px;
    border-radius: 50%;
}
}

@media only screen and  (max-width: 980px) {
  .et_header_style_split .mobile_menu_bar, 
  .et_header_style_left .mobile_menu_bar {    
    z-index: 9999;
  }
  #et-top-navigation {    
    padding-right: 5px;
  }
}

@media only screen and (min-width: 481px)  {
  #mobile_menu {    
    width: 340px;    
    margin-left: calc(100% - 340px);
  }
}
@media only screen and (max-width: 480px)  {
  #mobile_menu {    
    width: 290px;    
    margin-left: calc(100% - 290px);
  }
}


/* top header style  */

@media (max-width: 767px){

	
	body.admin-bar.et_fixed_nav #top-header {
   
    z-index: 99 !important;
}
}

.et-social-icons {
    float: right !important;

}


/* collapse submenu items */



.et_pb_menu .et_mobile_menu .menu-item-has-children > a,
#main-header .et_mobile_menu .menu-item-has-children > a {
   
    position: relative;
}

.et_pb_menu .et_mobile_menu .menu-item-has-children > a:after, #main-header .et_mobile_menu .menu-item-has-children > a:after {
    font-family: 'ETmodules';
    text-align: center;
    speak: none;
    font-weight: 600;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    font-size: 18px;
    content: '\4c';
    top: 11px;
    right: 13px;
}

.et_pb_menu .et_mobile_menu .menu-item-has-children.visible > a:after,
#main-header .et_mobile_menu .menu-item-has-children.visible > a:after {
    content: '\4d';
}

.et_pb_menu .et_mobile_menu ul.sub-menu,
#main-header .et_mobile_menu ul.sub-menu,
.et-db #et-boc .et-l .et_pb_menu .et_mobile_menu li ul.sub-menu {
    display: none !important;
    visibility: hidden !important;
    transition: all 1.5s ease-in-out;
}

.et_pb_menu .et_mobile_menu li.visible > ul.sub-menu,
#main-header .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l #main-header .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l .et_pb_fullwidth_menu .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l .et_pb_menu .et_mobile_menu li.visible > ul.sub-menu {
    display: block !important;
    visibility: visible !important;
}


/** hide divi secondary menu site wide **/

#main-header .et_mobile_menu .menu-item-has-children.visible > a:after {
      color: #ffcf0c !important;
}
.et_mobile_menu li a:hover, .nav ul li a:hover {
   
    opacity: unset;
}

.mobile_menu_bar:before {
    color: #4d90fe !important;
}



.woocommerce-Price-currencySymbol
 {
    padding-right: 7px;
    font-size: 30px;
    color: #292b7a;
}

/* slider style reset */

input[type=range] {
  -webkit-appearance: none; /* Hides the slider so that custom slider can be made */
  width: 100%; /* Specific width is required for Firefox. */
  background: transparent; /* Otherwise white in Chrome */
}

input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
}

input[type=range]:focus {
  outline: none; /* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */
}

input[type=range]::-ms-track {
  width: 100%;
  cursor: pointer;

  /* Hides the slider so custom styles can be added */
  background: transparent; 
  border-color: transparent;
  color: transparent;
}

/* custom style thumb */

/* Special styling for WebKit/Blink */
input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  border: 5px solid #292b7a;
  height: 10px;
  width: 20px;
  border-radius: 3px;
  background: #292b7a;
  cursor: pointer;
  padding:8px;
  margin-top: 0px; /* You need to specify a margin in Chrome, but in Firefox and IE it is automatic */
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; /* Add cool effects to your sliders! */
}

/* All the same stuff for Firefox */
input[type=range]::-moz-range-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 36px;
  width: 16px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
}


/* All the same stuff for IE */
input[type=range]::-ms-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 36px;
  width: 16px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
}



@media (max-width: 767px){
button.button.wcdp-button.wcdp-right {
    float: left;
    margin-top: 10px;
}
}

button#place_order {
    background-color: #292b7a;
    font-weight: 700;
    text-transform: uppercase;
    color: #ffffff !important;
    font-size: 20px !important;
    border-radius: 10px;
    border-width: 0px;
    border-color: #333;
    border-style: solid;
    transition-property: background-color;
    transition-duration: 300ms;
    transition-timing-function: ease;
    transition-delay: 0ms;
    padding-top: 16px !important;
    padding-right: 55px !important;
    padding-bottom: 16px !important;
    padding-left: 55px !important;
}
button#place_order:hover {  
	    background-color: #f3b42c;
    padding-top: 16px !important;
    padding-right: 55px !important;
    padding-bottom: 16px !important;
    padding-left: 55px !important;
	 color: #ffffff !important;
	 }
.mobile_menu_bar:before {
    color: #f3b42c !important;
}


@media (max-width: 767px){
.table-container {
    width: 100%;
    overflow-x: auto;
}
}

/* woocommerce-button */

.woocommerce-button {
	 background-color: #292b7a !important;
    font-weight: 700;
    text-transform: uppercase;
    color: #ffffff !important;
    font-size: 20px !important;
    border-radius: 10px !important;
    border-width: 0px;
    border-color: #333;
    border-style: solid;
	
}


.et_pb_scroll_top.et-pb-icon {

    background: #292b7a !important;
}
body {
    color: #000000;
}