/*
 Theme Name:   Hanne-Child
 Description:  Hanne Child Theme
 Author:       James Page
 Author URI:   http://jcdpage.co.uk
 Template:     hanne
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  hanne-child
*/

body {
background:#0c3041;
font-family:'Nimbus';
color:#fff;
}
#page {

}
.main-navigation {
float:none;
}
a {
color:#fff;
}
@font-face {
font-family:'Nimbus';
src:url('fonts/NimbusRomNo9L-Reg.otf') format('embedded-opentype');
}
#masthead {
background:#0c3041;
}
#feature-header {
background:#0c3041;
margin-top: 40px;
overflow:hidden;
background-size:100%;
background-position: 20px -340px;
border-bottom:4px solid #999;
padding: 2px;
}
#feature-header-container {
    width: 1080px;
    margin: 0 auto;
    margin-top:60px;
}
#header-image {
height:500px;
width:50%;
background-size:100%;
    margin: 0px;
    float:left;`
    overflow:hidden;
}
#header-image img {
    border:5px solid #fff;
    }
#header-text {
color:#ddd;
float:left;
width:40%;
font-weight:300;
margin:0 5%;
text-align: justify;
}
h1,h2,h3,h4,h5,h6 {
color:#fff;
font-family:'Nimbus';
}
h2 {
font-size:42px;
margin-bottom: 20px;
}
h3 {
margin-bottom:20px;
}
.mega-container {
    background:none;
    }
    .ngg-gallery-thumbnail span {
    text-align:right;
    font-family:'Nimbus';
    padding-right:10px;
    font-size:12px !important;
    color:#000;
    }
    .ngg-gallery-thumbnail {
    background-color: #fff !important;
    border: 1px solid #ccc !important;
    color:#fff !important;
    width: 240px;
    }
    .ngg-gallery-thumbnail img {
    width:100%;
    }
    .ngg-navigation span,.ngg-navigation a.next, .ngg-navigation a.page-numbers, .ngg-navigation a.prev, .ngg-navigation span.next, .ngg-navigation span.page-numbers, .ngg-navigation span.prev {
    background:#fff;
        font-size: 16px;
        padding:10px 15px !important;
        border:2px solid #09c;
        color:#000;
        margin:0;
    }
    #fancybox-overlay {
    opacity:1 !important;
    background:#000 !important;    
    }
    #masthead .site-branding {
	display:inline;
    }
    #masthead h1.site-title {
    margin-bottom: 20px;
    }
    #masthead h1.site-title a {
    color:#fff;
    font-family:'Nimbus';
    font-weight:300;
    font-size:20px;
    }
    #masthead h2.site-description {
    color:#ccc;
    font-size:16px;
    text-align:left;
    display:none;
    }
    #site-navigation {
    background:#000;
    border-bottom:0px solid #000;
    padding: 10px;
    }
    #site-navigation ul li {
    float:left;
    }
    #site-navigation ul li a {
    color:#ccc;
    font-family:'Nimbus';
    font-size:18px;
    text-transform:none;
    }
     #site-navigation ul li a:hover {
     color:#fff;
     }
    #content {
margin-top:0;
padding-top:0;
    }
    .container {
    max-width: 1125px;

    }
    #site-navigation ul .current-menu-item>a, #site-navigation ul .current_page_ancestor>a, #site-navigation ul .current_page_item>a {
    background:none;
    color:#fff;
    }
    #site-navigation ul li:hover a {
    background:none;
    }
    .owl-carousel .owl-stage-outer {
    margin-top:-40px;
    }
    .owl-carousel .owl-item img {
    width: 240px !important;
    height: auto !important;

    margin: 10px !important;
    }
    #frame {
    width: 306px;
    margin:4px;
    height:auto;
    font-size:12px;
        display: inline-block;
    width: 306px;
    }
    #painting {
    width: 300px;
    height:220px;
    }
    #frame span, #painting span {
    clear:both;
    color:#eee;
    }
    #title {
    display:inline-block;
    color:#fff;
    }
    #title span {
    font-size:9px;
    color:#eee;
    margin-left: 10px;
    }
    #colophon {
    background:#000;
        color: #ccc;
        
    }
    #colophon a, #colophon a:visited {
    color:#aaa;
    text-decoration:none;
    }
    .portBox {
            max-width: 65%;
        height:auto !important;
    background: none;
    -webkit-box-shadow:none;
    left: 17.5%;
    right: auto;

    }
    .portBox span {
    font-size:12px;
    color:#eee;
    margin-left:20px;
    }
    #Nativity, #Triptych, #PrincessDiana, #KeyWithAda, #NotInMyName, #SnowSceneWithJack, #FireOnPier, #Moonlight {
    width:85% !important;
    left: 17.5% !important;
    }
    .portBox img {
    width:100% !important;
    height:auto !important;
    }
    .portBox-overlay {
    opacity:1;
    background:#0c3041;
    }
    .portBox h3 {
    font-size:18px;
    }
    .portBox img#caption {
    width:70% !important;
    float:left;
    }
    .page #primary-mono h1.entry-title span {
    background:#333;
    padding:10px;
    color:#fff;
    }
    h3 {
    font-size:30px;
    }
    scrollBar img {
    width:100%;
    }
    #description, #description-full {
    float:left;
    margin-top:15px;
    font-size:14px;
    width: 27%;
    margin-left:3%;
    }
    #description-full {
    width:100%;
    margin:0;
    margin-top:15px;
    }
    #description p, #description-full p {
    color:#fff;
    font-size:14px;
    }
    .white {
    
    }
    #block {
    width:45%;
    margin:0 2.5%;
    float:left;
    text-align:justify;
    color:#fff;
    font-size: 16px;
    line-height: 1.8em;
    }
    #block label {
    float: left;
    width: 25%;
    clear: both;
        padding: 10px 0;
        text-align:left;
        margin-right: 5%;
    line-height: 1.4em;
    }
    .entry-content p {
    color:#fff;
    }
    #profile {
    float: right;
    color: #fff;
    width:30%;
    }
    #mainimage {
    width:65%;
    margin-right:5%;
    color:#fff;
    font-size:16px;
    }
    #mainimage span {
    font-size:12px;
    margin-left:20px;
	color:#eee;
    }
    #mainimage img {
    width:100%;
    padding-bottom:10px;
    }
    .page #primary-mono h1.entry-title span {
    background:none;
    }
    .page #primary-mono h1.entry-title {
    text-transform:none;
        display: none;	
    }
    .sa_owl_theme .owl-dots .owl-dot span {
    background-color:#777 !important;
    }
    .sa_owl_theme .owl-dots .active span {
    background-color:#fff !important;
    }
    button, button:hover {
    box-shadow:none;
    background:none;
    }
    #contact-input {
    padding: 10px 0;
        float: left;
    width: 60%;
    }
    input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], textarea {
    width:100%;
    }
    div.wpcf7 .ajax-loader {
    position:absolute;
    }
    div.wpcf7-mail-sent-ok {
    border: 2px solid #398f14;
    clear: both;
    background: #398f14;
    color: #fff;
    }
    .sa_owl_theme .owl-nav .owl-prev {
    left: -15px !important;
}
    .sa_owl_theme .owl-nav .owl-next {
    right: -15px !important;
}
div#Portrait.portBox,div#NotInMyName.portBox {
    max-width: 50%;
    left: 25% !important;
}
div.wpcf7-validation-errors {
    clear: both;
    background: #f7e700;
}
span.wpcf7-not-valid-tip {
    color: #ddd;
    }
    @media screen and (max-width: 1200px) {
    #frame {
    width: 45%;
    margin: 0 2% 0 2%;
    vertical-align: top;
    padding-bottom: 20px;
    }
    #painting {
    width: 100%;
    height: 240px;
    }
    .white {
    text-align:center;
    margin-top: 50px;
    }
    div#Portrait.portBox,div#NotInMyName.portBox {
    max-width: 70%;
    left: 15% !important;
}
    }
     @media screen and (max-width: 992px) {
     .portBox img#caption {
     width:100%;
     }
     #description, #description-full {
          clear:both;
     width:100%;
     }
     #description p {
     clear:both;
     width:100%;
     }
     }
    @media screen and (max-width: 767px) {
    #site-navigation {
    display:none;
    }
        #painting {
    height: 140px;
    }
    .portBox {
    max-width: 95%;
    min-width: 95%;
    left: 0% !important;
    }
    #Nativity, #Triptych, #PrincessDiana, #KeyWithAda, #NotInMyName, #SnowSceneWithJack, #FireOnPier, #Moonlight {
    width:95%;
    }
    .portBox img#caption {
    width:100% !important;
    }
    #description {
    clear:both;
    width:100%;
    margin-left:0;
    }
    #title {
        margin-top: 10px;
        }
    #block {
    width:100%;
    margin: 0;
    }
    button#responsive-menu-button {
    top:50px !important;
    }
    #responsive-menu-container li.responsive-menu-item {
    padding:10px 0;
    }
        div#Portrait.portBox,div#NotInMyName.portBox {
    max-width: 90%;
    left: 5% !important;
}
    }
    @media screen and (max-width: 600px) {
    #painting {
    height: 120px;
    }
    .entry-content h2 {
    text-align:center;
    }
    }
    @media screen and (max-width: 480px) {
     #profile, #mainimage {
    width:100%;
    }
        #painting {
    height: 80px;
    }
    }