/*
Theme Name: Transformation Beyond Beauty
Description: Child theme for the Avada
Author: Norwin Lacson
Template: Avada
*/
@font-face {
	font-family: desyrel;
	src: url('http://www.transformationsbeyondbeauty.com/wp-content/uploads/2014/10/DESYREL_.ttf') format('truetype');
}

@font-face {
	font-family: gothic;
	src: url('http://www.transformationsbeyondbeauty.com/wp-content/uploads/2014/10/gothic.ttf') format('truetype');
}


@import url("../Avada/style.css");  /* Obtain The parent CSS */

/* Header ========================================================================== */




html , body {
top: 80px !important;
	/* IE10 Consumer Preview */ 
background-image: -ms-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #88D4E3 100%);

/* Mozilla Firefox */ 
background-image: -moz-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #88D4E3 100%);

/* Opera */ 
background-image: -o-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #88D4E3 100%);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(radial, center center, 0, center center, 505, color-stop(0, #FFFFFF), color-stop(1, #88D4E3));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-radial-gradient(center, circle farthest-corner, #FFFFFF 0%, #88D4E3 100%);

/* W3C Markup, IE10 Release Preview */ 
background-image: radial-gradient(circle farthest-corner at center, #FFFFFF 0%, #88D4E3 100%);

    
}

body {
padding-top: 100px;
}

 #header .logo a img {
	position: absolute;
	margin-top: -290px !important;
	margin-left: -140px !important;
	max-width: 550px !important;

}

#wrapper, .header-wrapper, .header-v4, #header{
	border-top-left-radius : 70px !important;
	-moz-border-radius-topleft : 70px !important;	
	-webkit-border-top-left-radius: 70px !important;
}

#header h3.tagline {
	font-family: gothic !important;;
	font-size : 40px !important;
	color: #00A6CF !important;
	margin-top: -200px !important;
font-weight: bold;
}

.service {

	font-family: gothic !important;;
	font-size : 19px !important;
	color: #00a6cf!important;
	margin-top: -100px !important;
	margin-right: 30px !important;
	//font-weight: bold;
       line-height: 30px;
       text-align:center;
}
.service a{
color: #00a6cf!important;}
.tyabb{
	margin-top: -195px !important;
	margin-left: 620px !important;
	position: absolute;
}
	
}

.leftwing{ margin-left: -45px !important; }
.rightwing { margin-right: -70px !important; }

.top-header {
margin-top: -35px !important;
color: #DA38B4;
float:right;
font-size: 30px;
font-family : desyrel;
}

.page-title-container {
    background-color: #DA38B4 !important;
    font-family : desyrel;
}
#wrapper .page-title h1 {
    font-family : desyrel !important;
     font-size: 20px !important;
}

/* Responsive View ================================================================ */
@media only screen and ( min-width: 981px ) and ( max-width: 1100px ) {

.rightwing { margin-right: -25px !important; }
.leftwing img {margin-left: -890px !important; }




#wrapper, .header-wrapper, .header-v4, #header{
	border-top-left-radius : 0px !important;
	-moz-border-radius-topleft : 0px !important;	
	-webkit-border-top-left-radius: 0px !important;
}
#wrapper { width: 980px !important; }
.tyabb{  margin-left: 650px !important; }
.tyabb img{  max-width: 70% !important; }
#header .logo a img {
	//margin-top: -270px !important;
	//margin-left: -20px !important;
	//max-width: 500px !important;
}
}

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

#wrapper { width: 790px !important; }
#wrapper, .header-wrapper, .header-v4, #header{
	border-top-left-radius : 0px !important;
	-moz-border-radius-topleft : 0px !important;	
	-webkit-border-top-left-radius: 0px !important;
}

.header-v4 #header .tagline { float: right;}
.header-v4 #header .logo { 
	//float: left; 
	//margin-top: 40px; 
	//max-width: 500px !important;
	//margin-top: -0px !important;
	//margin-left: -10px !important;
}
}

@media only screen and ( min-width: 768px ) and ( max-width: 799px ) {
#wrapper { width: 750px !important; }
#wrapper, .header-wrapper, .header-v4, #header{
	border-top-left-radius : 0px !important;
	-moz-border-radius-topleft : 0px !important;	
	-webkit-border-top-left-radius: 0px !important;
}

#header .logo a img { 
	max-width: 460px !important;
	margin-top: -250px !important;
	margin-left: -390px !important;
}

.mobile-menu-design-classic .header-v4 #header .tagline
{
	float : right !important;
	font-size : 25px !important;
}

.service { font-size : 16px !important;}
.tyabb {  
	margin-left: 480px !important;
	max-width: 270px !important; 
	}
.top-header {
	position: absolute;
	float: right !important;
    margin-left: 350px !important;
}


}

@media only screen and ( max-width: 767px ) {}

@media only screen  and ( min-width:480px ) and ( max-width: 640px ) {
#wrapper { width: 480px !important; }
#wrapper, .header-wrapper, .header-v4, #header{
	border-top-left-radius : 0px !important;
	-moz-border-radius-topleft : 0px !important;	
	-webkit-border-top-left-radius: 0px !important;
}

#header .logo a img { 
                      max-width: 380px !important; 
		      margin-left: -260px !important;	
	 margin-top: -210px !important;
}

.mobile-menu-design-classic .header-v4 #header .tagline
{
	float : right !important;
	font-size : 20px !important;
//display: none !important;
}

.service { font-size : 14px !important; }
.tyabb {  
	//margin-left: 480px !important;
	//max-width: 270px !important; 
display: none !important;
	}
.top-header {
	position: absolute;
        font-size : 25px !important;
	//float: right !important;
        margin-left: 30px !important;
}



}

@media only screen  and ( min-width: 320px ) and ( max-width: 479px ) {
#wrapper { width: 320px !important; }
#wrapper, .header-wrapper, .header-v4, #header{
	border-top-left-radius : 0px !important;
	-moz-border-radius-topleft : 0px !important;	
	-webkit-border-top-left-radius: 0px !important;
}

#header .logo a img { 
                      max-width: 320px !important; 
		      margin-left: -170px !important;	
	 margin-top: -210px !important;
}

.mobile-menu-design-classic .header-v4 #header .tagline
{
	//float : right !important;
	//font-size : 25px !important;
display: none !important;
}

.service { font-size : 9px !important; }
.tyabb {  
	//margin-left: 480px !important;
	//max-width: 270px !important; 
	}
.top-header {
	position: absolute;
        font-size : 20px !important;
	//float: right !important;
        margin-left: 30px !important;
}


}