/*
 Theme Name:   Craft Child
 Theme URI:    http://www.site2see.com.au
 Description:  Craft Child Theme
 Author:       Angelo
 Author URI:   http://www.site2see.com.au
 Template:     craft
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  craft-child
*/


@import url(../craft/style.css);

/*@font-face{

font-family: lovelo;
src: url(fonts/LoveloBlack.otf);
}
*/

/* ---- Custom child CSS starts here ---- */


	
/* ----  GENERAL settings  ----- */




#header_container {
    margin: 0 auto;
    border-bottom: 1px solid #ddd;
    padding: 0 0!important;
    background-color: #f9f9f9;
    border-top: 15px solid #294064!important;
    border-bottom: 15px solid #294064!important;
}

.row{
    max-width: 84.5em!important;
    width: 100%!important;
    /*margin-left: 0;
    margin-right: 0;*/
}

.row .row {
    margin-left: 0!important;
    margin-right: 0!important;
}

#logo {
	width: 50%!important;
    text-align: center;
    margin: auto;
}

#logo img {
    margin: auto;
}

#header2 {
    margin: 0 auto;
    padding-bottom: 0!important;
    position: relative;
}

div#menubar {
	display: none;
    position: absolute;
    right: 10px;
    bottom: 5px;
}

#menubar a {
	font-weight: 600!important;
	color: #294064!important;
}

#menubar a:hover {
	top: 2px;
}


/*  ------ PAGE CONTENT ----- */


/* ---- Hero Banner ----- */

#slider_container {
    overflow: hidden;
    background-color: #596887;
    min-height: 460px;
    position: relative;
}

.hero-content{
    width: 40%;
    height: auto;
    position: absolute;
    right: 2%;
    bottom: 4%;
}


img.hero-img {
	width: 100%;
	height: auto;
	position: relative;
}


h1.hero-h1 {
   color: #091c39;
   font-weight: 700;
   font-size: 31px
;}

p.hero-p {
   color: #091c39;
   font-size: 19px;
}

.call-to-action-btn {
    font-size: 90%;
    color: #f9f9f9;
    padding: 4px 18px;
    border: 3px solid #f9f9f9;
    border-radius: 4px;
    background-color: #091c39;
}


/* ---- MAIN CONTENT AREA ----- */

#box_container {
    width: 100%;
    margin: 0 auto;
    padding: 0!important;
    border-bottom: 1px solid #ddd;
}

/* ---- Section 2 - Services ----- */


#feature-boxes {
    width: 100%;
    background-color: #f1f1f1;
    padding: 50px 20px;
}

.box-content {
    padding: 10px;
    text-align: left;
}

.box-head img {
    border-top-left-radius: 9px;
    border-top-right-radius: 9px;
}

h2.services-heading {
    text-align: center;
    margin: 20px 0;
    color: #294064!important;
}

.title-head {
    color: #294064!important;
}
.boxes {
    border: 1px solid #294064!important;
    border-radius: 9px;
    min-height: 600px!important;
}




/* ---- Section 3 - Business Philosophy ----- */

#my-philosophy {
    width: 100%;
    position: relative;
    background-color: #f9f9f9;
    padding: 30px 0;
}

.my-goals {
    width: 48%;
    padding: 5px 2%;
    display: inline-block;
    text-align: center;
    margin: 0 auto;
    vertical-align: top;
}

.my-goals ul {
    display: inline-block;
    text-align: left;
}

.my-offer {
    width: 48%;
    padding: 5px 2%;
    display: inline-block;
    text-align: center;
    margin: 0 auto;
    vertical-align: top;
}

.my-offer ul {
    display: inline-block;
    text-align: left;
}

.a-better-way {
    display: inline-block;
    position: relative;
    width: 90%;
    margin: 30px 5%;
    padding: 0;
}

.a-better-way h2 {
    text-align: center;
    margin-bottom: 14px;
    color: #294064!important;
}

.a-better-way h3 {
    text-align: center;
    margin: 20px 0 15px 0;
    font-size: 160%;
    color: #294064!important;
}

.way1 {
    display: inline-block;
    clear: all;
    width: 33%;
    min-height: 200px;
    margin-top: 20px;
    padding-right: 3%;
    vertical-align: top;
}
     
img.img-way1{
    height: 100%;
    width: auto;
    margin: auto;
    display: block;
}     

.way2 {
    display: inline-block;
    clear: all;
    width: 33%;
    min-height: 200px;
    margin-top: 20px;
    padding-right: 3%;
    vertical-align: top;
}

img.img-way2{
    height: 100%;
    width: auto;
    margin: auto;
    display: block;
}   
   
.way3 {
    display: inline-block;
    clear: all;
    width: 31%;
    min-height: 200px;
    margin-top: 20px;
    vertical-align: top;
}

img.img-way3 {
    height: 100%;
    width: auto;
    margin: auto;
    display: block;
}      

.take-action {
    width: 100%;
    display: inline-block;
    position: relative;
}
img.t-action {
    width: 37%;
    margin: 30px auto;
    margin: auto;
    display: block;
}




/* ------- Section 4 - Contact-Us page --------- */

#contact-us {
    width: 100%;
    background-color: #f1f1f1;
    padding: 50px 20px;
    min-height: 200px;
}

#contact-us h2 {
    text-align: center;
    font-weight: 600;
    margin-bottom: 20px;
    color: #294064!important;
}

#contact-us h3 {
    text-align: center;
    font-weight: 600;
    margin-bottom: 20px;
    color: #294064!important;
}


/* ------ Contact Us Form ----------- */

.fscf-box {
    margin: 20px auto;
    width: 80%;
    display: block;
    text-align: center;
}

.fscf-box p {
    display: none;
}

div#FSContact1 {
    margin: auto;
    text-align: center;
    display: block;
    box-shadow: none!important;
}

input#fscf_submit1 {
    cursor:pointer; 
    margin:0; 
    background-color: #294064!important; 
    height: 45px; 
    border-radius: 5px; 
    padding: 5px; 
    color: #f4f4f4!important;
    font-weight: 600!important; 
    border: 1px solid #f4f4f4!important;
    /*border: 3px solid rgba(138, 139, 140, 0.49)!important; */
    /*color: #576983;*/
    width: 100%;
    box-shadow: 3px 3px 5px rgb(244, 244, 245)!important;
}

input#fscf_submit1:hover {
    box-shadow: 3px 3px 5px #ccc inset!important;
    border: 2px solid #f4f4f4!important;
}

.textwidget a {
    color: #f2f2f2;
}

#subhead_container {
    padding: 7px 20px;
    background: #294064!important;
}

#subhead_container h1{
    font-weight: 600!important;
    color: f3f3f3;
}

.post-entry p{
    display: none;
    
}



/* ------ Section 6 - Footer ----------  */

.xoxo   {
	list-style: none;
}

footer {
    background: #294064!important;
}


#footer-info {
    background-color: #294064!important;
}

#footer-widget {
    background: #294064!important;
    width: 100%;
    padding: 8px 0px 8px 2px;
}

#footer-widget .widget-container ul li {
    border-bottom: 1px solid #294064;
    padding: 7px 5px;
    list-style: none;
}


.textwidget li p {
	margin-bottom: 0!important;
    line-height: 10px;
}

.textwidget {
    line-height: 34px;
}


#footer-widget {
    
}

#footer-widget.xoxo li {
    list-style: none;
}

#footer-widget .widget-container ul li a {
    color: #a8a8a8;
}

#footer-widget .widget-container a {
    padding-left: 15px;
    color: #a8a8a8;
    font-style: italic;
    font-weight: 600;
}

#footer-widget .widget-container ul li a:hover {
    color: #6f6f6f;
}


#copyright a {
    letter-spacing: 1px;
    font-size: 15px;
    font-style: italic;
}

.contact-email a {
    padding-left: 0!important;
}


#footer-bar1 {
	width: 29%;
	margin-left: 10%;
}


#footer-bar2 {
	width: 27%;
}


#footer-bar3 {
	width: 31%;
}


/* ----------------------------- */

/* ------- MEDIA QUERIES ------- */

/* ----------------------------- */

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


}





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

	h1.hero-h1 {
	    font-weight: 600;
	    font-size: 23px;
	}

	p.hero-p {
	    font-size: 16px;
	}

}



@media only screen and (max-width: 1110px){
    .a-better-way h3 {
        text-align: center;
        margin: 20px 0 15px 0;
        font-size: 140%;
    }



}




@media only screen and (max-width: 1025px) {
    .large-3 {
        position: relative;
        width: 50%!important;
    }


    #footer-bar1, #footer-bar2 {
        float: none;
        width: 49%;
        display: inline-block;
        margin: auto;
        vertical-align: top;
    }

    #footer-bar3 {
        float: none;
        clear: all;
        width: 50%;
        display: block;
        margin: auto;
    }

 
}




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


	h1.hero-h1 {
	    font-weight: 600;
	    font-size: 20px;
	}

	p.hero-p {
	    font-size: 15px;
	}

	.hero-content {
	    width: 60%;
	    height: auto;
	    position: absolute;
	    right: 2%;
	    bottom: 4%;
	}


}




@media only screen and (max-width: 790px) {
	
	h1.hero-h1 {
	    font-weight: 600;
	    font-size: 18px;
	}

	p.hero-p {
	    font-size: 14px;
	}

	.hero-content {
	    width: 65%;
	    height: auto;
	    position: absolute;
	    right: 2%;
	    bottom: 4%;
	}


	.call-to-action-btn {
		width: 30%;
	}

}




@media only screen and (max-width: 790px) {
    .way1 {
        width: 48%;
        margin-right: 3%
    }

    .way2 {
        width: 48%;
    }

    .way3 {
        display: block;
        width: 50%;
        margin: 15px auto;
    }



}


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


    #footer-bar1, #footer-bar2, #footer-bar3 {
        float: none;
        display: block;
        width: 241px;
        margin: auto;
    }

	#slider_container {
	    overflow: hidden;
	    background-color: #596887;
	    min-height: 450px;
	}

	.hero-content {
	    width: 95%;
	    height: auto;
	    position: absolute;
	    right: 2%;
	    bottom: 4%;
	}

	.call-to-action-btn {
	    font-size: 70%;
	}


    
    .way1 {
        display: block;
        width: 75%;
        margin: 15px auto;
    }

    .way2 {
        display: block;
        width: 75%;
        margin: 15px auto;
    }

    .way3 {
        display: block;
        width: 75%;
        margin: 15px auto;
    }


    .my-goals {
        width: 75%;
        padding: 5px 2%;
        display: block;
        text-align: center;
        margin: 0 auto;
    }

    .my-offer {
        width: 75%;
        padding: 5px 2%;
        display: block;
        text-align: center;
        margin: 0 auto;
    }

}





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

	#slider_container {
	    overflow: hidden;
	    background-color: #596887;
	    min-height: 420px;
	}

    .large-3 {
        position: relative;
        width: 100%!important;
    }


}




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

	#slider_container {
	    overflow: hidden;
	    background-color: #596887;
	    min-height: 400px;
	}


   
}