body { font-family: Arial;  vertical-align: top; margin: 0 auto; padding: 0; background-color: #EFD769; text-align: center;}

a { text-decoration:none; color:Purple; }

/* setup links style */
a:link { color:#ffffff; }

a:visited { color:orange; }

/*when someone hovers over the link */
a:hover { color:#000000; background-color:inherit;}


.href_black
{
  color:#2E4A5A;
  font-weight:600;
  font-family:Arial, Calibri, Helvetica; font-size:16px;
}

.href_black:visited
{ 
  color:#2E4A5A;
  font-weight:600;
}

.href_black:hover
{ 
  color:#000000; 
}

.href_black a
{ 
  color:#2E4A5A; 
  font-weight:600;
}


/* Change Image on Hover */
#hoverimage {
    background-image: url('https://www.gaframes.com/images/button_addtocart_white.png' );
    background-repeat: no-repeat;
    height: 70px;
    width: 237px;
    border: none;
}

#hoverimage:hover {
    background-image: url('https://www.gaframes.com/images/button_addtocart_black.png');
    background-repeat: no-repeat;
    border: none;
}

/*Enlarge image on hover */
.thumbnail:hover 
{
    position:relative;
    top:-25px;
    left:-35px;
    width:400px;
    height:auto;
    display:block;
    z-index:999;
}

.thumbnail_large:hover 
{
    position:relative;
    top:-25px;
    left:-35px;
    width:500px;
    height:auto;
    display:block;
    z-index:999;
}



/*#container_all { width: 1280px; height:600px; background-image:url(../images/woodbg_new.png); background-repeat:no-repeat; vertical-align:top; }*/
#container_all { width: 100%;  background-image:url(../images/woodbg_new.png); background-repeat:repeat; vertical-align:top; }

#top_frame_logo { float:left; width:100%; height:250px; }

.container_inner1 { float:left; text-align:center; width:100%; vertical-align: top; margin: 0 auto; padding: 0; }
.container_inner { text-align:center; vertical-align: top; margin: 0 auto; padding: 0;  width:980px;  color:#ffffff; height:820px; font-family:Calibri, Helvetica; font-size:18px; }

#container_index {  text-align:center;  vertical-align: top; margin: 0 auto; padding: 0;  width:980px; height:1030px; font-family:Calibri, Helvetica; font-size:18px; }
#container_contact { text-align:center; background-color:#ffffff; vertical-align: top; margin: 0 auto; padding: 0;  width:980px; height:1050px; font-family:Calibri, Helvetica; font-size:18px; }
.container_shop { text-align:center; background-color:#ffffff; vertical-align: top; margin: 0 auto; padding: 0;  width:980px; height:auto !important; font-family:Calibri, Helvetica; font-size:18px; }


#container_news{ text-align:center; background-color:#ffffff;  vertical-align: top; margin: 0 auto; padding: 0;  width:980px;  height:790px; font-family:Calibri, Helvetica; font-size:18px; }
#container_gallery{ text-align:center; background-color:#ffffff;  vertical-align: top; margin: 0 auto; padding: 0;  width:980px; height:780px; font-family:Calibri, Helvetica; font-size:18px; }


/* Turn all image links border into nothing */
a img { border: none; }

.container { font-family: Arial; width:100%; border: 0; background-color:#ffffff; vertical-align: top; margin: 0 auto; padding: 0; height:280px; text-align: center; vertical-align:top; }

/* TOP SECTION */
#top_left { float:left; text-align:left; font-size:26px; width:35%; color:#ffffff; font-family:DejaVu Sans,Helvetica;}
#top_right { float:right; width:60%; margin:5% 0 0 0; text-align:right; vertical-align:bottom;}

.space_between { float:left; margin:5% 0 0 0; }

.sceneryimage { float:left; background-position:center; text-align:center; background-image:url(../images/scenerymerge.jpg); background-repeat:no-repeat; width:100%; height:492px;}

#textalign_right { float:right; }

#advice { float:left; font-family:Calibri, Helvetica; font-size:14px; margin:1% 0 0 7%;  }

/*  */
#para_all { float:left; width:100%; }

#fundamentals { float:left; width:100%; color:#FFD457; text-align:center; font-family:Calibri, Helvetica; font-weight:bold; margin:5% 0 0 0; font-size:18px; }


/* FOOTER */
.container_footer1 { float:left; text-align:center; width:100%; vertical-align: top; margin: 0 auto; padding: 0;  }
.container_footer { text-align:center; vertical-align: top; margin: 0 auto; padding: 0;  width:980px; background-color:#97BCF0; color:#000000; height:70px; font-family:Calibri, Helvetica; font-size:18px; }

#footer_left { float:left; text-align:center; vertical-align: top; margin:0 0 0 0; width:0%; font-size:16px; }
#footer_middle { float:left; text-align:center; vertical-align: top; margin:0 0 0 0; width:99%; font-size:14px; }
#footer_right { float:right; text-align:center; vertical-align: top; margin:0 0 0 0; width:0%; font-size:16px;  }

.contact_us { float:right; width:100%; text-align:right; vertical-align:top; }
#contact { width:10%; }


h1 {
    font-family: 'Arial Narrow', sans-serif;
    font-weight: 600;
    line-height: 46px;
    font-size: 22px;
    margin: 0 0 23px 0;
    padding:5% 0 0 0;
    color:#000000;
    
    }
    
h2 {
    font-family: 'Helvetica', sans-serif;
    font-weight: 500;
    font-size: 16px;
    text-align:left;
    line-height: 23px;
    line-height:1.3;
    margin: 0 6% 0 6.5%;
    font-style:italic;
    }
    
h3 {
    font-family: 'Dosis', sans-serif;
    font-weight: 400;
    line-height: 46px;
    font-size: 40px;
    margin: 3% 0 23px 0;
    text-align:center;
}

h4 {
    font-family: 'Dosis', sans-serif;
    font-weight: 500;
    font-size: 11px;
    line-height: 23px;
    line-height:1.6;
    margin: 0 0 0 8%;
    text-align:left;
    }

h5 {
    font-family: 'Dosis', sans-serif;
    font-weight: 100;
    font-size: 20px;
    line-height: 23px;
    line-height:1.3;
    margin: 0 0 0 8%;
    text-align:left;
    }
    
h6
    {
        font-family: 'Helvetica', sans-serif; 
        font-weight: 100;
        font-size: 16px;
        line-height: 23px;
        line-height:1.3;
        text-align:center;
        vertical-align:bottom text-bottom;
        /*background-color:#8F6360;*/
        color:White;
        margin:0 6% 0 6%;
        /*padding:3.4% 0 0 0;*/
        height:62px;
        color:White;
    }
    
h7 {
    font-family: 'Helvetica', sans-serif;
    font-weight: 500;
    font-size: 16px;
    text-align:left;
    line-height: 23px;
    line-height:1.3;
    font-style:italic;
    color:#705831;
    }
    

.painting_title 
    { 
        font-family: 'Helvetica', sans-serif, 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; 
        font-weight: 500;
        font-size: 25px;
        line-height: 23px;
        line-height:1.3;
        text-align:center;
        vertical-align:bottom text-bottom;
        /*background-color:#8F6360;*/

        margin:0 6% 0 6%;
        /*padding:3.4% 0 0 0;*/
        height:62px;
        width:90% !important;
        color:#262626;

    }

.painting_artist
    { 
        font-family: 'Helvetica', sans-serif; 
        font-weight: 100;
        font-size: 16px;
        line-height: 23px;
        line-height:1.8;
        text-align:center;
        vertical-align:bottom text-bottom;
        /*background-color:#8F6360;*/

        margin:0 6% 0 6%;
        /*padding:3.4% 0 0 0;*/
        height:62px;
        width:90% !important;
        color:#262626;

    }

    .painting_addtobag
    { 
        font-family: 'Helvetica', sans-serif; 
        font-weight: 500;
        font-size: 16px;
        line-height: 23px;
        line-height:1.8;
        text-align:center;
        vertical-align:bottom text-bottom;
        /*background-color:#8F6360;*/
        border:solid 2px black;
        border-radius:5px;
        padding:5%;

        height:62px;
        width:100%;
        max-width:100%;
        color:#262626;
    }

    .painting_addtobag:hover {
        background-color: 262626;
        color:#ffffff;
      }



#top_left_container
{
    float:left;
    width:38%;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    line-height: 23px;
    text-align:right;
    vertical-align:top;
    margin:0 29% 0 0;
}

#top_right_container
{
    float:right;
    width:32%;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    line-height: 23px;
    text-align:left;
    font:normal 22px Trebuchet MS;
    vertical-align:top;
}

#top_all
{
      float:left;
      width:100%;
      height:20px;
      background-color:#EFD769;  
      z-index:100;
      vertical-align:top;

}


#right_telephone
{
    float:right;
    width:50%;
    text-align:right;
}
    
p {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    line-height: 23px;
    margin: 4% 0 0 8%;
    text-align:left;
    
    }

/* Contact Page */
.framing-services { float:left; width:15%; padding:0 0 0 7%; vertical-align:top; text-align:left; font-family:Helvetica,DejaVu Sans Light; font-weight:bold; font-size:16px; }
.contact-the-braid {float:left; width:25%; vertical-align:top; text-align:left; font-family:Helvetica,DejaVu Sans Light; font-size:16px;}
.frames-mouldings { float:right; width:53%; vertical-align:top; text-align:center; font-family:Helvetica,DejaVu Sans Light; font-size:15px;  }
.frames-services{ float:right; width:53%; vertical-align:top; text-align:left; font-family:Helvetica,DejaVu Sans Light; font-size:15px;  }

.framing-services-ga { float:left; width:40%; padding:0 0 0 7%; vertical-align:top; text-align:left; font-family:Helvetica,DejaVu Sans Light; font-weight:bold; font-size:14px;  }

/* News Page */
.news-framing { float:left; background: linear-gradient(to bottom, white, #FFE4B5); width:86%; border-top-style:ridge; border:ridge 20px black; vertical-align:top; text-align:justify; padding:5% 4.5% 3% 5.5%; font-family:Helvetica,DejaVu Sans Light; font-size:16px; color:#5B5B5B; }
#framing-news { float:left; vertical-align:top; text-align:justify; font-family:Lucida Handwriting, Curlz MT; font-size:16px; color:#5B5B5B; }


/* INDEX PAGE : Divide into 4 Sections Categories */
.gallery-framing { float:left; width:86%; z-index:1000; background-color:#FFFFFF; vertical-align:top; text-align:justify; padding:5% 7% 3% 7%; font-family:Helvetica,DejaVu Sans Light; font-size:16px; color:#5B5B5B; }

.pictures { float:left; width:100%; padding:3% 0 0 0; font-family:Helvetica,DejaVu Sans Light; font-size:19px; color:#ffffff;  }
.pictures-gallery { float:left; width:100%; padding:1% 0 0 0; font-family:Helvetica,DejaVu Sans Light; font-size:13px; color:#ffffff;  }


#picture-all { float:left; width:21%; margin:0 1.3% 0 6%; background-color:#60B9BF; color:#ffffff; text-align:center; outline-color:White; }

#picture-frames-icon { float:left; width:8%; text-align:right; }
#picture-frames { float:left; width:18%; text-align:left; margin:1% 0 0 0;  }

#tshirt-all { float:left; width:21%;margin:0 1.4% 0 0; background-color:#60BEA3; color:#ffffff; outline-color:White; }
#tshirt-framing-icon { float:left; width:5%; text-align:right;  }
#tshirt-framing { float:left; width:18%; text-align:left; margin:1% 0 0 0;   }

#bespoke-all { float:left; width:21%; outline-color:White; background-color:#C3AB51; color:#ffffff; }
#bespoke-frames-icon { float:left; width:5%; text-align:right;  }
#bespoke-frames { float:left; width:18%; text-align:left; margin:1% 0 0 0;  }

#fineart-all { float:right; width:21%; margin:0 6% 0 1%; outline-color:White; background-color:#B66683; color:#ffffff; }
#fine-art-paintings-icon { float:left; width:5%; text-align:right;  }
#fine-art-paintings { float:right; width:21%; text-align:left; margin:1% 0 0 0;  }



/* Menubar in menu_style css page */

/* GALLERY PAGE : Divide into 6 Sections Categories */

#oil-painting { float:left; width:31.1%; margin:0 1% 0 1%; background-color:#404040; color:#ffffff; text-align:center; outline-color:White;  }

.oil-painting { float:left; width:31.1%; margin:0 1% 0 1%; background-color:#404040; color:#ffffff; text-align:center; outline-color:White; }
.oil-painting-new { float:left; width:31.1%; margin:0 1% 0 1%; background-color:#ffffff; color:#ffffff; text-align:center; outline-color:White; }

.oil-painting-titles { float:left; width:31.1%; height:86%; margin:0 1% 0 1%; background-color:#ffffff; color:#262626; text-align:center; outline-color:White;  }

#oil-painting-gallery { float:left; width:26%; size:14px; font-weight:normal; margin:0 1% 0 6.5%; background-color:#ffffff; color:#000000; text-align:left; outline-color:Black; }

.oil-painting-left { float:left; width:50%; vertical-align:top;  }
.oil-painting-right { float:right; width:50%; vertical-align:top; text-align:right; }
.oil-painting-all { float:left; width:100%; vertical-align:top;  }
.oil-image { width:300px; height:auto; }


#objects-framed { float:left; width:33.1%; margin:0 0 0 0; background-color:#404040; color:#ffffff; text-align:center; outline-color:White; }

.objects-framed { float:left; width:33.1%; margin:0 0 0 0; background-color:#404040; color:#ffffff; text-align:center; outline-color:White;  }
.objects-framed-new { float:left; width:33.1%; margin:0 0 0 0; background-color:#ffffff; color:#ffffff; text-align:center; outline-color:White;  }

.objects-framed-titles { float:left; width:33.1%; margin:0 0 0 0; background-color:#ffffff; color:#262626; text-align:center; outline-color:White;  }

#objects-framed-gallery { float:left; width:50%; margin:0 0 0 3%; background-color:#ffffff; color:#000000; text-align:left; outline-color:Black; }

#family-photos-framed { float:right; width:31.1%; margin:0 1% 0 1%; background-color:#404040; color:#ffffff; text-align:center; outline-color:White; }

.family-photos-framed { float:right; width:31.1%; margin:0 1% 0 1%; background-color:#404040; color:#ffffff; text-align:center; outline-color:White; }
.family-photos-framed-new { float:right; width:31.1%; margin:0 1% 0 1%; background-color:#ffffff; color:#ffffff; text-align:center; outline-color:White; }

.family-photos-framed-titles { float:right; width:31.1%; margin:0 1% 0 1%; background-color:#ffffff; color:#262626; text-align:center; outline-color:White; }

#move_right_slideshow { margin: 0 0 0 6%; vertical-align:top;  }


/* ----------- iPhone 5 and 5S ----------- */

/* Portrait */
@media only screen 
  and (min-device-width: 320px)
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
    #container_all { width:1200px; height:100%; background-color:#ffffff; height:280px; vertical-align:top; }

    .container { font-family: Arial; width:1200px;  background-color:#ffffff; margin: 0 auto; padding: 0; height:280px; vertical-align:top; }

    body{
         /*This adjusts automatically the font size for iPHone*/
        -webkit-text-size-adjust:none;
        font-family:Helvetica, Arial, Verdana, sans-serif;

    }
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
    
    #container_all { width:1300px; height:100%; background-color:#ffffff; height:280px; vertical-align:top; }

    .container { font-family: Arial; width:1300px;  background-color:#ffffff; margin: 0 auto; padding: 0; height:280px; vertical-align:top; }

}


/* ----------- Android Phone Alcatel ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 450px)
  and (-webkit-min-device-pixel-ratio: 1) {
	#container_all { width:100%; height:100%; background-color:#ffffff; height:280px; vertical-align:top; }

}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 450px)
  and (-webkit-min-device-pixel-ratio: 1)
  and (orientation: portrait) {

	#container_all { width:1000px; background-color:#ffffff; height:280px; vertical-align:top; text-align:center; }

	.container { font-family: Arial; width:830px; border: 0; background-color:#ffffff; margin: 0 auto; padding: 0; height:280px; vertical-align:top; }

	#top_left_container {
		float:left;
		width:150px;
		}
	#top_right_container
	{
		float:right;
		width:150px;
		font-family: 'Open Sans', sans-serif;
		font-size: 14px;
		text-align:left;
	}
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 450px)
  and (-webkit-min-device-pixel-ratio: 1)
  and (orientation: landscape) {

    #container_all { width:1050px; height:100%; background-color:#ffffff; height:280px; vertical-align:top; }

    .container { font-family: Arial; width:740px; border: 0; background-color:#ffffff; margin: 0 auto; padding: 0; height:280px; vertical-align:top; }

    #top_left_container {
	    float:left;
	    width:150px;
	    }
    #top_right_container
    {
        float:right;
	    width:150px;
        font-family: 'Open Sans', sans-serif;
        font-size: 14px;
        text-align:left;
    }

}



/* Samsung Galaxy Tablet resolution 1280 x 800 */

@media (max-device-width: 800px) and (orientation: portrait) {  
	#container_all { width:980px; background-color:#ffffff; height:280px; vertical-align:top; }
    .container { font-family: Arial; width:980px; border: 0; background-color:#ffffff; vertical-align: top; margin: 0 auto; padding: 0; height:280px; text-align: center; vertical-align:top; }

 }

@media (max-device-width: 1280px) and (orientation: landscape) { 
 /*    .add_some_space { float:left; width:100%; height:5.1%; }
    
	#container_all { width:1300px; background-color:#ffffff; height:280px; vertical-align:top; }
    .container { font-family: Arial; width:100%; border: 0; background-color:#ffffff; vertical-align: top; margin: 0 auto; padding: 0; height:280px; text-align: center; vertical-align:top; }
*/
}


/* Add Some Space */
.add_some_space { float:left; width:100%; height:5.1%; }


