/* 
Theme Name: Truss and Frame
Theme URI: http://cyberchimps.com/guide/child-theme-example/
Description: Responsive Child Theme
Template: responsive
Version: 1.0.0
Author: CyberChimps
Author URI: https://cyberchimps.com/
License: GNU General Public License
License URI: license.txt

Colours:
Green Heading: #004A99
Lighter Green: #0689FF
Very Light Green: #AED9FF
Links Purple: #004A99
   
Grey Text: #888
Logo Colour: #4a94b8 "final" ( & #669aaf & #00587b )
Logo Type Underline: #bbd0e5
         
*/

/* =Start From Here
--------------------------------------------------------------*/

@import url(http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800,300italic,400italic,600italic,700italic);
@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,400,600,700,800,300italic,400italic,600italic,700italic);


#headerbar{height:175px;background: #FFFFFF;}
#footerbar{height:70px;margin:-70px;background: #004A99;} /* this'll me 90 & -980px when the footer menu is switched on */
#footer {color: #fff;}
#footer a {color: #fff;}
#footer a:hover {color: #AED9FF;}

#container {background: #fff; margin-top: -175px;}

#wrapper {margin: 0px auto;}
#content-full {margin-top: 0;}

#header-extra-text {}

.accordion2 h3 {font-size: 1em;}

body {color: #656565}
#container {box-shadow: 0 0 17px #AAAAAA;}

h1, h2, h3, h4, h5, h6 {color: #0689FF; font-family: 'Open Sans Condensed', sans-serif;}
h1 {color: #004A99; font-weight: 400;}

ol, ul { list-style-position: inside; }     /* Fix Heel and Arch Pain page - dot points left of image */
#therapy_page_logo { margin-bottom:80px;}   /* Fix Sports page - extend image by the margin to continue dot points down the page*/

a {color: #004A99;}
.toggle a:link, .toggle a:visited {color: #004A99;}
.toggle a:hover, .toggle a:active {color: #7c9ad0;}

.menu {
background-color: #004A99;
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#0689FF), color-stop(100%,#004A99));
background: -webkit-linear-gradient(top, #0689FF 1%,#004A99 100%);
background: -moz-linear-gradient(top, #0689FF 1%, #004A99 100%);
background: -ms-linear-gradient(top, #0689FF 1%,#004A99 100%);
background: -o-linear-gradient(top, #0689FF 1%,#004A99 100%);
background: linear-gradient(to bottom, #0689FF 1%,#004A99 100%);
clear: both;
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0689FF', endColorstr='#004A99',GradientType=0 );
    }
.menu a {border-left: 1px solid #FFFFFF;}
.menu a:hover  {
    background-color: #004A99;
    background-image: none;
    }
.menu .current_page_item a, .menu .current-menu-item a {
    background-color: #004A99;
    background-image: none;
}

.js .main-nav {
    background-color: #004A99;
    background-image: -moz-linear-gradient(center top , #0689FF, #004A99);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#0689FF), color-stop(100%,#004A99));
    background: -webkit-linear-gradient(top, #0689FF 1%,#004A99 100%);
    background: -moz-linear-gradient(top, #0689FF 1%, #004A99 100%);
    background: -ms-linear-gradient(top, #0689FF 1%,#004A99 100%);
    background: -o-linear-gradient(top, #0689FF 1%,#004A99 100%);
    background: linear-gradient(to bottom, #0689FF 1%,#004A99 100%);
    clear: both;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0689FF', endColorstr='#004A99',GradientType=0 );
    }

.top-menu li a:link, .top-menu li a:visited {font-family: 'Open Sans Condensed', sans-serif; font-size: 1.6em; font-style: normal; font-weight: 300;  color:#004A99;}
.top-menu li a:hover, .top-menu li a:active {color: #AED9FF;}

#logo {width: 300px; height: 100px;}

#details {font-family: 'Open Sans Condensed'; font-style: italic; font-weight: 300; color: #004A99; }

a.emails:link, a.emails:visited { color: #004A99; font-style: italic; font-weight: 400;}
a.emails:hover, a.emails:active { color: #AED9FF; font-style: italic; font-weight: 400;}

/* =Responsive (Mobile) Design
-------------------------------------------------------------- */

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

	body {}

        .top-menu {
            position: relative;
            display: block;
            float: right;
            top: 0.4em;
            margin: 0;
            padding: 0;
            font-family: 'Open Sans', sans-serif;
            font-size: 0.9em;
            font-style: normal;
            font-weight: 300;
        }        

.footer-menu {
            position: relative;
            display: block;
            float: right;
            top: 0.4em;
            margin: 0;
            padding: 0;
            font-family: 'Open Sans', sans-serif;
            font-size: 0.9em;
            font-style: normal;
            font-weight: 300;
        }        

	#logo {
                position: relative;
                display: inline-block;
                float: left;
                top: 0;
                margin: 2.58em 0 2.58em 0;
                padding: 0;
                max-width: 100%;
                max-height: 100%;
        }
        
        #logo a img {width: 100%; height: auto;}
        
        #details {
                position: relative;
                display: block;
                float: none;
                top: 1.9em;
                left: 0;
                margin: 0;
                font-size: 2em;
        }
        
        #top-info {
            position: relative;
            display: block;
            float: right;
            top: 2em;
            right: -7.5em;
            margin: 0;
            padding: 0;
            width: 260px;
            height: 70px;
            text-align: right;
        }
        
        #telephone {
                font-family: 'Open Sans';
                position: relative;
                display:block;
                float: right;
                top: 0;
                left: 0;
                margin-bottom: 0.6em;
                right: 0;
                font-size: 2em;
                font-weight: 600;
                text-align: right;
                color: #004A99;
                clear: right;
        }
        
        #top_email {
            position: relative;
            display:block;
            float: right;
            top: 0;
            left: 0;
            margin: 0;
            font-family: 'Open Sans';
            font-size: 1.3em;
            font-style: italic;
            font-weight: 400;
            text-align: right;
            color: #333;
        }
}
@media screen and (min-width: 708px) and (max-width: 969px) {

	body {}

        .top-menu {
            position: relative;
            display: block;
            float: right;
            top: 0.4em;
            margin: 0;
            padding: 0;
            font-family: 'Open Sans', sans-serif;
            font-size: 0.9em;
            font-style: normal;
            font-weight: 300;
        }        
        
	#logo {
                position: relative;
                display: inline-block;
                float: left;
                top: 0;
                margin: 2em 0 1.8em 0;
                padding: 0;
                max-width: 100%;
                max-height: 100%;
        }
        
        #logo a img {width: 90%; height: auto;}
        
        #details {
                position: relative;
                display: block;
                float: none;
                top: 2.27em;
                left: -1.4em;
                margin: 0;
                font-size: 1.4em;
                z-index: 120;
        }
        
        #top-info {
            position: relative;
            display: block;
            float: right;
            top: 1.3em;
            right: -7.5em;
            margin: 0;
            padding: 0;
            width: 260px;
            height: 70px;
            text-align: right;
        }
        
        #telephone {
                font-family: 'Open Sans';
                position: relative;
                display: inline-block;
                float: none;
                top: 0;
                left: 0;
                margin-bottom: 0.25em;
                font-size: 2em;
                font-weight: 400;
                color: #004A99;
        }
        
        #top_email {
            position: relative;
            display:inline-block;
            float: none;
            top: 0;
            left: 0;
            margin: 0;
            font-family: 'Open Sans';
            font-size: 1.3em;
            font-style: italic;
            font-weight: 400;
            color: #333;
        }
}
@media screen and (min-width: 410px) and (max-width: 707px) {

	body {}
        
        .top-menu {
            position: relative;
            display: block;
            float: none;
            font-family: 'Open Sans', sans-serif;
            font-style: normal;
            font-weight: 300;
            text-align: center;
        }

	#logo {
                position: relative;
                display: block;
		float: none;
                top: 0;
                margin: 0 auto;
		text-align: center;
                z-index: 100;
        }
        
        #logo a img {width: 86%; height: auto;}
        
        #details {
                position: relative;
		float: none;
                display: block;
                top: 0;
                margin: 0.1em auto;
                font-size: 1.8em;
                font-weight: normal;
		text-align: center;
                z-index: 120;
        }
        
        #top-info {
            top: 0;
            position: relative;
            float: none;
            display: block;
            margin: 0 0 0.4em;
        }
        
        #telephone {
                position: relative;
		float: none;
                display: block;
                top: 0;
                margin: 0.4em 0 0.4em;
                color: #004A99;
                font-size: 2em;
                font-weight: normal;
		text-align: center;
        }
        
        #top_email {
                position: relative;
                display: block;
		float: none;
                top: 0;
                margin: 0;
                font-size: 1.3em;
		text-align: center;
        }
}
@media screen and (min-width: 321px) and (max-width: 409px) {

	body {}
        
        .top-menu {
            font-family: 'Open Sans', sans-serif;
            font-style: normal;
            font-weight: 300;
        }

	#logo {
                position: relative;
                display: block;
		float: none;
                top: 0;
                margin: 0 auto;
		text-align: center;
        }
        
        #logo a img {width: 80%; height: auto;}
        
        #details {
                position: relative;
		float: none;
                display: block;
                top: 0;
                font-size: 2em;
                font-weight: normal;
		text-align: center;
        }
        
        #top-info {
            top: 0;
            position: relative;
            float: none;
            display: block;
            margin: 0 0 0.4em;
        }
        
        #telephone {
                position: relative;
		float: none;
                display: block;
                top: 0;
                margin: 0.68em auto;
                color: #004A99;
                font-size: 1.8em;
                font-weight: normal;
		text-align: center;
        }
        
        #top_email {
                position: relative;
                display: block;
		float: none;
                top: 0;
                margin: 0;
                font-size: 1.3em;
		text-align: center;
        }
}
@media screen and (min-width: 241px) and (max-width: 320px) {
	
	body {}
        
        .top-menu {
            font-family: 'Open Sans', sans-serif;
            font-weight: 300;
            font-size: 0.7em;
        }

	#logo {
                position: relative;
                display: block;
		float: none;
		text-align: center;
                margin: 0;
                width: 100%;
        }
        
        #logo a img {width: 90%; height: auto;}
        
        #details {
                position: relative;
                display: block;
		float: none;
                top: -0.36em;
                margin: 0;
                font-size: 1.4em;
                font-weight: bold;
		text-align: center;
        }
        
        #top-info {
            top: 0;
            position: relative;
            float: none;
            display: block;
            margin: 0 0 0.4em;
        }
        
        #telephone {
                position: relative;
                display: block;
		float: none;
                top: 0;
                margin: 0.35em;
                color: #004A99;
                font-size: 1.5em;
                font-weight: bold;
		text-align: center;
        }
        
        #top_email {
                position: relative;
		float: none;
                display: block;
                top: 0;
                margin: 0;
                font-size: 1em;
		text-align: center;
        }
}
@media screen and (max-width: 240px) {
	
	body {}

        .top-menu {
            float: none;
            text-align: center;
            margin: 0.4em;
        }
        

	#logo {
                position: relative;
                display: block;
		float: none;
		text-align: center;
                margin: 0;
                width: 100%;
        }
        
        #logo a img {width: 80%; height: auto;}
        
        #details {
                position: relative;
                display: block;
		float: none;
                top: -0.36em;
                margin: 0;
                font-size: 1em;
                font-weight: bold;
		text-align: center;
        }
                
        #top-info {
            top: 0;
            position: relative;
            float: none;
            display: block;
            margin: 0 0 0.4em;
        }
        
        #telephone {
		float: none;
		text-align: center;
                margin: -0.7em;
                color: #004A99;
                font-weight: bold;
                font-size: 1em;
        }
        
        #top_email {
            position: relative;
            display: block;
            float: none;
            top: 0.8em;
            margin: 0 0 1.2em;
            font-size: 0.8em;
            text-align: center;
        }
}

/*The last 29 days of the month are the hardest."- Nikola Tesla*/