/*GLOBAL*/

body{
  font-family: "Raleway";
  
  background: linear-gradient( #62565F, #CECCDE);
  background: -moz-linear-gradient( #62565F, #CECCDE);
  background: -webkit-linear-gradient(#62565F, #CECCDE); 
  background-size:cover;



}


/*
color palette
#CECCDE
#624F59
background-color: rgb( 182,179,201);
#62565F
background-color: rgba( 182,179,201, 0.5);
*/

/*light to dark background option-
background: linear-gradient(direction, #62565F, #624F59, ...);

;*/


/*NAV*/

  /*MOBILE NAV*/

    /*    .mobilenav{
          display:block;
          position:relative;
          margin:40px 50px;
          cursor:pointer;
          height:24px;}
                
                
          .mobilenav span:nth-child(1){top:0px;}
          .mobilenav span:nth-child(2){top:12px;}
          .mobilenav span:nth-child(3){top:24px;}

*/



    /*.transparent {opacity:0;}
    .rotate-top{transform:rotatez(45deg);-webkit-transform-origin:0%;left:2px}
    .rotate-bottom{transform:rotatez(-45deg);-webkit-transform-origin: 15%;}
*/

/*
     .menu-icon span {
                    display:block;
                    background:white;
                    height:4px;
                    width:40px;
                    position:absolute;
                    transition:all 0.5s ease;
                }

       .menu-icon span:nth-child(1){top:0px;}
          .menu-icon span:nth-child(2){top:12px;}
          .menu-icon span:nth-child(3){top:24px;}

          .menu-icon{
            color:transparent;
            width:0;
          }


    .transparent {opacity:0;}
   .menu-icon .rotate-top{transform:rotatez(45deg);-webkit-transform-origin:0%;left:2px}
   .menu-icon .rotate-bottom{transform:rotatez(-45deg);-webkit-transform-origin: 15%;}


  .title-bar{
            background-color: transparent;
          }
    
    .title-bar ul{
      display:inline-block;

    }*/


.offcanvas-full-screen {
  position: fixed;
  z-index: 1;
  transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  background: #0a0a0a;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
          transform: translateX(-100%);
  overflow-y: auto;
}

[data-whatinput='mouse'] .offcanvas-full-screen {
  outline: 0;
}

.offcanvas-full-screen.is-transition-overlap {
  z-index: 10;
}

.offcanvas-full-screen.is-transition-overlap.is-open {
  box-shadow: 0 0 10px rgba(10, 10, 10, 0.7);
}

.offcanvas-full-screen.is-open {
  -webkit-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
          transform: translate(0, 0);
}

.offcanvas-full-screen.is-open ~ .off-canvas-content {
  -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
          transform: translateX(100%);
}

.offcanvas-full-screen.is-transition-push::after {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 1px;
  box-shadow: 0 0 10px rgba(10, 10, 10, 0.7);
  content: " ";
}

.offcanvas-full-screen.is-transition-overlap.is-open ~ .off-canvas-content {
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
}

.offcanvas-full-screen-inner {
  padding: 1rem;
  text-align: center;
}

.offcanvas-full-screen-menu {
  margin: 0;
  list-style-type: none;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

      .offcanvas-full-screen-menu > li {
        -webkit-flex: 0 0 auto;
            -ms-flex: 0 0 auto;
                flex: 0 0 auto;
      }

      [data-whatinput='mouse'] .offcanvas-full-screen-menu > li {
        outline: 0;
      }

      .offcanvas-full-screen-menu > li > a {
        display: block;
        padding: 0.7rem 1rem;
        line-height: 1;
      }

      .offcanvas-full-screen-menu input,
      .offcanvas-full-screen-menu select,
      .offcanvas-full-screen-menu a,
      .offcanvas-full-screen-menu button {
        margin-bottom: 0;
      }

      .offcanvas-full-screen-menu > li {
        -webkit-flex: 0 0 100%;
            -ms-flex: 0 0 100%;
                flex: 0 0 100%;
        max-width: 100%;
      }

      .offcanvas-full-screen-menu > li > a {
        -webkit-justify-content: flex-start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -webkit-align-items: flex-start;
            -ms-flex-align: start;
                align-items: flex-start;
      }

      .offcanvas-full-screen-menu a {
        color: #fefefe;
      }

      .offcanvas-full-screen-menu a:hover {
        color: #b2b2b2;
      }

      .offcanvas-full-screen-close {
        color: #fefefe;
        font-size: 5rem;
      }

      .offcanvas-full-screen-close:hover {
        color: #b2b2b2;
      }



      .top-bar{
        background:transparent;
      }






/*END NAV*/


/*page id*/

.page_id{
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
  color:#DBDBDB;
  padding-left: 2.5rem;
  margin-top: -1.3rem;
  
  font-size: 1.2rem;

}

/*END page id*/


/*HERO and OWL*/
    

      .heros{
          padding: 0;
          display: inline-flex;
          align-items: center;
          max-width: 70%;

         
      }

      .heros img{
         box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);

      }


      .owl-carousel .owl-item img{
        display:inline-block;
      }

    

      .wideheros{
        max-width:100%;
     
      }

     /* .tallheros img{
        max-width: 200;
      
      }*/


       .tallheros img{
        max-width: 50%;
      

      }
    /*  .heros {
          position: fixed;
          left: 0;
          right: 0;
          top: 15%;
          bottom: 0;
          text-align: center;
      }

      img.make-it-fit {
          max-width: 99%;
          max-height: 99%;
      }*/


      .owl-prev{
        padding-top: 10px;
        float:left;
        display: inline;

         font-style: italic;

      }


      .owl-next{
        padding-top: 10px;
        float:right;
        display: inline;
        font-style: italic;
        border-right: 16rem;
        border-radius:1px;

      }



/*END HEROS*/

/*
  homepage Tagline*/

      .tagline{
        padding-top: 6rem;


      }

      .tagline h1{
            font-size: 1.8rem;
            font-family: 'Raleway';
           font-weight: 400;
           font-style: italic;
           letter-spacing: .01em;
           color: #62565F;
        
      }

      .visting p{
        font-size: .7em;

      }


/*
END homepage Tagline*/



/*Image Caption Hover Effects */


      .title {
        color: #fff;
        display:none;
        
        -webkit-transition: all 0.3s ease-in-out;
          -moz-transition: all 0.3s ease-in-out;
            -o-transition: all 0.3s ease-in-out;
              -ms-transition: all 0.3s ease-in-out;
                transition: all 0.3s ease-in-out;
        
      } 
      

/*End Image Hover Effects*/


/*GLOBAL GALLERY STYLES*/

    .gallerytype p{
      font-size:.8em;
      margin: 1.5%;
      font-weight: 700;
      

    }

      .galleryspaces{
       
        flex-wrap: wrap;
      }


      .gallerymain{
        padding-top: 5%;
        
      }



  .largeimage{
      justify-content: center;
      box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);
     
    }

  .largeimage img{
 

  }

  .largeimage{

  }

  .largecaption{
   
    box-shadow: none;
    width: auto;
    height:100px;
  
   justify-content: center;

 

  }

/*  .largecaption p{
    font-size:1em;
    line-height: 1.1;
    margin-bottom: 0;

  }
*/
/*End Global Gallery Styles*/

.ep_coloredpencils{
    padding-right: 5%;
      padding-left: 5%;
       display:flex;
       justify-content: space-between;
       align-self: center;

}

.ep_coloredpencils img{

       box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);
}

.ep_coloredpencilscaptions{

    padding-top: 2%;
    padding-right: 5%;
      padding-left: 5%;
       display:flex;
       justify-content: space-between;
       align-self: center;

       }
/*En Plein Aire Mixed Media Styles*/



    .epmixedmedia{
      padding-right: 5%;
      padding-left: 5%;
       display:flex;
       justify-content: space-between;
       align-self: center;

    }

    .epmixedmedia img{
       box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);

    }


    .ep_watercolor img{
      box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);


    }

/*End En Plein Aire Mixed Media Styles*/




/*En Plein Aire Oil Styles*/


    .epoil{
      padding-right: 5%;
      padding-left: 5%;
      padding-bottom: 5%;
      display:flex;

      
      justify-content: space-between;
      align-content: center;
      

     
    }

    /*box shadow rules- 
    h-shadow , v-shadow, blur, spread, color, inset, initial, inherit
*/
    .epoil img{
      box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);
    }
    
    /*flex rules will always be 1/3 2/3 of remaining width 
    etc.*/




/* End En Plein Aire Oil Styles*/



/*En Plein Aire Pastel Styles*/


.ep_pastel{
      padding-right: 5%;
      padding-left: 5%;
      display:flex;
      justify-content: space-between;
      align-self: center;

}

.ep_pastel img{
       box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);

    }
/*End En Plein Aire Pastel Styles*/


/*In studio Colored Pencils*/

  .in_coloredpencils{

     padding-right: 5%;
      padding-left: 5%;
      display:flex;
      justify-content: space-between;
      align-self: center;

  }
    .in_coloredpencils img{
         box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);

      }

  

/*END In studio Colored Pencils*/


/*In studio Pastels*/


  .in_pastel{
      padding-right: 5%;
      padding-left: 5%;
      padding-bottom: 5%;
      display:flex;
      justify-content: space-between;
      align-self: center;
      max-width: 80%;

  }

    .in_pastel img{

         box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);

      }



/*END In studio Pastels*/



/*In studio Encaustics*/


  .in_encaustics{
      padding-right: 5%;
      padding-left: 5%;
      padding-bottom: 5%;
      display:flex;
      justify-content: space-between;
      align-self: center;

  }

    .in_encaustics img{
         box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);

      }


/*END In studio Encaustics*/


/*In studio oil*/

  .in_oil{
      padding-right: 5%;
      padding-left: 5%;
      padding-bottom: 5%;
      display:flex;
      justify-content: space-between;
      align-self: center;

  }

    .in_oil img{
         box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);
  }

    /*flex rules will always be 1/3 2/3 of remaining width 
    etc.*/

             /*   .flex1 {
            -webkit-flex: 1;
                    flex: 1;
                  }
          .flex2 {
            -webkit-flex: 2;
                    flex: 2;
                  }
*/


/*END in studio oil*/


/*in studio mixed media*/

.in_mixedmedia{
      padding-right: 5%;
      padding-left: 5%;
      display:flex;
      justify-content: space-between;
      align-self: center;
}


.in_mixedmedia img{
         box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);

      }

/*END in studio mixed media*/


  
/*In studio pastel*/

  .in_pastel{
      padding-right: 5%;
      padding-left: 5%;
      padding-bottom: 5%;
      display:flex;
      justify-content: space-between;
      align-self: center;

  }
      
    /*flex rules will always be 1/3 2/3 of remaining width 
    etc.*/
/*
                .flex1 {
            -webkit-flex: 1;
                    flex: 1;
                  }
          .flex2 {
            -webkit-flex: 2;
                    flex: 2;
                  }*/

.in_pastel img{
         box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);

      }


/*END in studio pastel*/




/*Awards and Affilations*/


  .affiliations {
    
    align-items: baseline;
    padding-top: 6rem;
   color:#DBDBDB;
  }

  .affiliations p{
    padding-top: 5%;
    font-size:1.2em;
  }

 .affiliations img{
  padding: 2%;
  display: flex;
  align-items:center;
 }


  .affiliationstop h1{
     font-family: 'Overlock', sans-serif;
     color:#DBDBDB;
  }

/*  font-family: 'Roboto', sans-serif;*/

  .backgroundawards{
    background-color: #62565F !important;
  }

  .affiliations a{
    color:white;
    font-weight: bold;
  }

 

   .awards{
    padding-top: 8rem;
    font-size:.8rem;
    color:#DBDBDB;
  }


  .awards h1{
    font-family: 'Overlock', sans-serif;
    color:#DBDBDB;

  }

  .awards p{
    font-size:1.6em;
  }
 

  .ribbon{
    width:2em;
    color:#DBDBDB;
    box-shadow: none;
    

  }

  .imageshadow{
     box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);

  }

  .awardlogo{
    width: 10em;
    padding-top: 5%;
    padding-bottom: 5%;
  }

  .lastimage{
    padding-bottom: 25%;
  }

  

  
/*
End awards
*/

/*form contact*/

  form{
    margin-top: 5%;
    margin-bottom:5%;

  }



[ type= 'submit'] {
  border-radius: 10px;
  font-family: 'Raleway';
  font-size:inherit;
  font-weight: bold;
  color:#62565F;
  background-color: #DBDBDB;
  height: 2.6em;
  width: 50%;
  padding:2%;
  border-width:3;

}

[ type= 'submit']:hover {
  background-color: #62565F;
  color:#DBDBDB;


}

  .contactbonnie{
    font-family: 'Raleway';
    font-style:italic;
    font-size:.95em;
  }

  .aboutp{
    font-size: .9em;
    color:#DBDBDB;



  }

  .aboutp p{

    word-spacing: .2em;


  }


  .firstcharacter{
    font-size:5.2em;
    float:left;     
    line-height: 60px;
    padding-top: 5px;
    padding-right: 8px;
    font-weight: 600;
    font-family: 'PT Sans', sans-serif;
  
  }

  .aboutptwo{
    font-size: .9em;
     color:#DBDBDB;



  }

  .aboutptwo p{

    word-spacing: .2em;


  }

  .promobio{
    padding-top: 10%;
    padding-bottom: 5%;
  }

  .promobio h1{
    font-size: .95em;
    color:#DBDBDB;
    font-style: italic;

  }

  .quotes{
    font-size:1.8em;
    font-style:italic;
  
  }

  .fblogo{
    height: 3.4em;
    width: auto;
    color:#DBDBDB;
    padding-top: 2%;
    text-align: right;
    
  }

   .fblogo:hover{
    height:5em;
    
  }

  .fblink{
    font-size:1.2em;
    font-weight: 600;
    color:#DBDBDB;
    font-style:italic;

  }

  .fblink:hover{
    font-size:1.2em;
    font-weight: 600;
    color:blue;
    font-style:bold;

  }


  .credits{
    font-family: 'Roboto';
    font-size: .8em;
    font-weight: lighter;
    padding: 5px;
      }

/*end form & contact*/


/*thank you page*/
  .thanks h1{
    font-style: 'Raleway';
    font-weight: bold;
    color: #DBDBDB;

  }
  .thanks p{
    color:#DBDBDB;
  }

  .thanks p:hover{
    color:blue;
  }

/*end thank you page*/



/*Footer*/


  footer{
   background-color: rgba(0,0,0,0.1);
   margin-top: 25%;
   max-height:50px;
   max-width: 100%;
   font-size: .8rem;

  }

/*sticky footer --
position:absolute;
width:100%;
*/



/*End Footer*/
















@media screen and (min-width: 40em) {



/*tablet and large menu*/
    .top-bar-right{
      max-height: 100px;
      width:auto;
    }

      .mega-menu .dropdown-pane {
        width: 100%;
        max-width: 85rem;
        margin: 0 auto !important;
        left: 0% !important;
        right: 0% !important;
        background-color:#62565F;
        padding:0% !important;

      }

      .mega-menu .menu {
        background: none;
        
        
       }


      .mega-menu > a::after {
        display:block;
        width: 0;
        height: 0; 
        content: '';
        border-bottom-width: 0;
        border-top-style: none;
        border-color: rgb( 182,179,201,);
        margin-left: 10px;
        margin-top: 5%;
        padding: 0px;
        border-width: 0px;
      }

      .menu >li {
        display:inline-flex;
        vertical-align: top;
        
        font-size:.9em;
      }


      .menu > li > a{
        color:#DBDBDB;
        background-color: #8D8796;

      }
      

      .menu > li > a::after{
        color:#DBDBDB;

        

      }

      .menu > li > a:hover{
        color:#624F59;
        font-style:italic;
        opacity:.5;
        background-color: #CECCDE;

      }

/*background-color: rgba( 182,179,201, 0.5);*/

      .top-bar {
      background-color: transparent; 
     
      padding-bottom: 0px;

      }

          .top-bar ul{
          background-color: #8D8796;


          }

    



          
          .dropdown-pane{
            border:none;
            background-color:#62565F;
            position: inherit;
            padding: 0%;

          }

        .dropdown-pane .column{
          padding: 0%;

        }  

/*END tablet and large navigation*/

/*OWL FIXES IN SIZE*/
/*    .wideheros{
          width:600px;
       
        }

   .tallheros img{
          max-width: 450px;
        
        }*/

/*large image screen sizes*/

    .largeimage{
      justify-content: space-between;
      max-width: 600px;
    }

    .largecaption{
      margin-top: -1rem;
    }
/*END large image screen sizes*/





.menu-icon > .dark{
  display: none;
}


.ep_watercolor{
  max-width: 700px;
}


 /*awards and affiliations fixes*/

      .affiliations {
        display: flex;
        align-items: baseline;
        padding-top: 6rem;
       color:#DBDBDB;
      }


      .awards img{
        width:80%;

      }



       .awards{
        padding-top: 8rem;
        color:#DBDBDB;
      }


      .awards h1{
        font-family: 'Overlock', sans-serif;
        color:#DBDBDB;

      }

      .awards p{
        font-size:.9em;
      }
     

      .ribbon{
        display: inline-block;
        width: 3em !important;
        color:#DBDBDB;
        box-shadow: none;
        

      }

      .imageshadow{
         box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);

      }

      .awardlogo{
        width: 3em !important;
        padding-top: 5%;
        padding-bottom: 5%;
        display: inline-block;

      }

      .lastimage{
        padding-bottom: 25%;
      }

/*end awards and affiliations fixes*/


}


@media screen and (min-width: 64em) {


 /* Menu Fixes*/


    .menu > li > a::after{
        color:#DBDBDB;
        padding-bottom: 0px;
      }

/*End menu fixes*/

  /*OWL FIXES IN SIZE*/
      /*.wideheros{
                max-height:680px;

             }*/
              

        /* .tallheros img{
                max-width: 500px;
              
              }*/

/*END OWL FIXES IN SIZE*/


/*large image screen sizes*/

    .largeimage{
      justify-content: center;
      max-width: 780px;
      max-height: 720px;
      
    }

    .largecaption{
      margin-top: -1.2rem;
    }

/*END large image screen sizes*/


                .flex1 {
            -webkit-flex: 1 0 120px;
                    flex: 1 0 120px;
                    min-height: 0;
                  }
          .flex2 {
            -webkit-flex: 2 0 200px;
                    flex: 2 0 200px;
                    min-height: 0;
                  }



/*Image Caption Hover Effects */
 

 .title {
        font-weight:700;
        color: #fff;
        display:block;
        -webkit-transition: all 0.3s ease-in-out;
          -moz-transition: all 0.3s ease-in-out;
            -o-transition: all 0.3s ease-in-out;
              -ms-transition: all 0.3s ease-in-out;
                transition: all 0.3s ease-in-out;
        
      } 

          .screen {
            background-color: rgba(0,0,0,0.9);
            display:inline-block;
            font-weight:700;
            max-width: 110px;
            padding-right: .1%;
            padding-left: .1%;
            position:absolute;
            opacity: 1;
            z-index: -1;
            -webkit-transition: all 0.3s ease-in-out;
              -moz-transition: all 0.3s ease-in-out;
                -o-transition: all 0.3s ease-in-out;
                  -ms-transition: all 0.3s ease-in-out;
                    transition: all 0.3s ease-in-out;
          }


          .mixedmediascreen{
            
            font-weight:bold;
            
            opacity: 1;
            z-index: 999;
            -webkit-transition: all 0.3s ease-in-out;
              -moz-transition: all 0.3s ease-in-out;
                -o-transition: all 0.3s ease-in-out;
                  -ms-transition: all 0.3s ease-in-out;
                    transition: all 0.3s ease-in-out;
          }
         
          .mixedmediascreen img:hover{
            
           opacity:.4;
          }

          .mixedmediascreen img:hover .screen{
            z-index: 1000;
           opacity:1;
          }

          .title {
            color: #fff;
            
            -webkit-transition: all 0.3s ease-in-out;
              -moz-transition: all 0.3s ease-in-out;
                -o-transition: all 0.3s ease-in-out;
                  -ms-transition: all 0.3s ease-in-out;
                    transition: all 0.3s ease-in-out;
            
          }
          
          .screen:hover .title {
            margin-left: .1%;
          }
         
          .screen.fade-in .title {
            margin-left: 0;
          }
          .screen.fade-in:hover {
          }
                  
          *, *:before, *:after {
           padding: 0;
           margin: 0;
           box-sizing: border-box;
          }





 /*awards and affiliations fixes*/

      .affiliations {
        display: flex;
        align-items: baseline;
        padding-top: 6rem;
       color:#DBDBDB;
      }


      .awards img{
        width:95%;




      }




       .awards{
        padding-top: 8rem;
        font-size:.8rem;
        color:#DBDBDB;
      }


      .awards h1{
        font-family: 'Overlock', sans-serif;
        color:#DBDBDB;

      }

      .awards p{
        font-size:1.2em;
      }
     

      .ribbon{
        display: inline-block;
        width:5em !important;
        color:#DBDBDB;
        box-shadow: none;
        

      }

      .imageshadow{
         box-shadow: -4px 4px 8px 4px rgba(0, 0, 0, 0.2);

      }

      .awardlogo{
        width: 8em !important;
        padding-top: 5%;
        padding-bottom: 5%;
        display: inline-block;

      }

      .lastimage{
        padding-bottom: 25%;
      }

/*end awards and affiliations fixes*/



/*End Image Hover Effects*/



}

















