/* customization for chinese page */
:lang(zh):not(.et_pb_animation_top) { font-family: "Arial","宋体"; }

/*makes the button in rev slider from the portfolio page fontawesome type */
:lang(zh):not(.et_pb_animation_top) i.fa-icon-arrow-down {font-family: 'FontAwesome';}

/* changes back the font of icon so it shows as elegant theme icon */
span.scroll-down.et-pb-icon {
  font-family: "ETmodules";
}

/* Center the footer */
#footer-info {
	float:none;
    text-align:center;
}

/* Portfolio header fonts */
.portfolio-header{    
	font-size: 32px;
    color: black;
}

.portfolio-bullet {
  font-weight: bold;
}

.portfolio-plus {
 	color: #2facbf;
    padding: 0 5px;
}

.portfolio-content {
  color: rgb(0,0,0);
}

/*Portfolio in the index page */
.et_pb_fullwidth_portfolio .et_pb_portfolio_image.landscape img {
  width:100%; 
}
/* ------------------------------------------------------------------------
              CONTACT FORM 7(Contact me)
-------------------------------------------------------------------------*/

.wpcf7 {
  color: #6c6c6c;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="select"],
.wpcf7 input[type="captchar"],
.wpcf7 text
{
  color: #6c6c6c;
 background: rgba(255,255,255, 0.50);
 border: none;
 width: 100%;
  -webkit-border-radius: 8px;
 font-size: 14px;
 padding: 16px !important;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
}
#two-column{
	width: 100%;
}
#two-column #left{
	width: 49%;
	float: left;
}

#two-column #right{
	width: 50%;
	float: right;
}

#two-column p, .third p{
	margin-bottom: 6px;
}

#three-column {
  width:100%;
}

.third {
  width:30%;
  float:left;
  margin-right:3%;
}

.third:last-child {
  margin-right:0;
  float:right;
}

.wpcf7 .third span select {
  width:60%;
}

.wpcf7 #budget { 
	margin-top: 1%;
}

.wpcf7 textarea
{
  color: #6c6c6c;
  background: rgba(255,255,255, 0.50);
 border: none;
 width: 100%;
  -webkit-border-radius: 8px;
 font-size: 14px;
 padding: 16px !important;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
}

.wpcf7-captchar {
  background-color: #fff !important;
  border: 2px solid #C6E2FF;
 padding: 16px !important;
  border-radius: 12px;
  -moz-border-radius: 12px;
  -webkit-border-radius: 12px;
  color: #999 !important;
}

.wpcf7-submit {
  float:right;
  color: #6c6c6c;
  background: rgba(255,255,255, 1);
  border: 4px solid #ffffff;
 width: 30%;
  -webkit-border-radius: 8px;
 font-size:15px;
 padding: 6px 20px;
 line-height:1.7em;
 border-radius: 2px;
 height: 50px ! important;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
 -moz-transition: all 0.2s;
 -webkit-transition: all 0.2s;
 transition: all 0.2s;
}

.wpcf7-submit:hover {
  background: rgba(0,0,0, 0.50);
 color:#fff;
 border: 2px solid transparent;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
 -moz-transition: all 0.2s;
 -webkit-transition: all 0.2s;
 transition: all 0.2s;
}

#captchar {
  width:150px;
  /*height:30px;*/
}

.last-row {
  margin-right: 5%;
}

/* customizes the "how did you hear about me?" row */
.info {
  display:inline;
  padding-right:5%;
}

@media only screen and (max-width: 500px) {
  .wpcf7-submit {
  	margin-left: auto;
    margin-right: auto;
    display: block;
    width: auto;
    float: initial;
  }
}

/* all for the placeholder */
::-webkit-input-placeholder {
   color: #6c6c6c;
}

:-moz-placeholder { /* Firefox 18- */
   color: #6c6c6c;
}

::-moz-placeholder {  /* Firefox 19+ */
   color: #6c6c6c; 
}

:-ms-input-placeholder {  
   color: #6c6c6c;
}

/****** BOUNCING "MORE" ICON ******/
/* from https://elegantmarketplace.com/forums/topic/how-to-make-the-scroll-down-button-in-the-full-width-header-module-bounce/ */

@-webkit-keyframes bounce {
0%, 100% {
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-webkit-transform: translateY(0);
transform: translateY(0);
}
40% {
-moz-transform: translateY(-15px);
-ms-transform: translateY(-15px);
-webkit-transform: translateY(-15px);
transform: translateY(-15px);
}
}
@keyframes bounce {
0%, 100% {
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-webkit-transform: translateY(0);
transform: translateY(0);
}
40% {
-moz-transform: translateY(-15px);
-ms-transform: translateY(-15px);
-webkit-transform: translateY(-15px);
transform: translateY(-15px);
}
}
span.scroll-down.et-pb-icon { 
-webkit-animation-name: bounce;
animation-name: bounce;
-webkit-animation-duration: 2s;
animation-duration: 2s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}

/*Move the scroll down bottom to the side so it doesn't collide with button 2 in fullwidth header only in mobile */
@media only screen and (max-width: 500px) {
	section.et_pb_fullwidth_header  div.et_pb_fullwidth_header_scroll {
    	text-align: right;
	}
}

/*adds some space towards the bottom of responsive design slider demo */
.et_pb_fullwidth_section.responsive-demo-bg {
  padding-bottom: 30px;
}

/* moves the rev slider up in the home page so the header is on the rev slider bg*/
div.entry-content > div.et_pb_section:nth-child(1) > div.et_pb_fullwidth_code:nth-child(1) > div.forcefullwidth_wrapper_tp_banner{
  margin-top:-68px !important;
}

/*** Take out the divider line between content and sidebar ***/
#main-content .container:before {background: none;}
 
/*** Hide Sidebar ***/
#sidebar {display:none;}
 
/*** Expand the content area to fullwidth ***/
@media (min-width: 981px){
#left-area {
    width: 100%;
    padding: 23px 0px 0px !important;
    float: none !important;
}
}

