@charset "utf-8";

/* General styles*/
/*Define your own styles in this stylesheet*/
body{
	background-color: rgba(246,246,246,1.00);
}
h1, h2, h3, h4, h5, h6{
	font-family: 'montserrat' , sans-serif;
	color: rgba(75,74,74,1.00);
	font-style: normal;
	font-weight: 400;
	font-size: 19px;
}
p{
	font-size: 13px;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-style: normal;
	font-weight: bolder;
	color: rgba(251,247,248,1.00);
	line-height: 1.8;
}


/* Link styles*/
a {
	color: #000000;
}
a:visited {
	color:#000000;
}
a:hover {
    color: #FF5700;
    font-size: 1.8rem;
}
.linkStyle {
    color: rgba(58,53,53,1.00);
    font-family: 'montserrat', sans-serif;
    font-style: normal;
    font-weight: 600;
    text-decoration: none;
    font-size: 12px;
}
/* Header & HERO styles*/


/* Navigation styles*/

.topNavUl {
    position: static;
    margin-left: 0;
    margin-top: -18px;
    padding-top: 1px;
}
.topNavLI {
	
	margin-left: 1.6949%;
	clear: none;
	height: auto;
	position: static;
}

/* Typography styles*/
.textStyle {
    font-family: 'montserrat', sans-serif;
    font-style: normal;
    font-weight: 400;
    color: rgba(88,88,88,1.00);
    text-align: center;
    background-color: #E5E3E0;
    /* [disabled]padding: 2%; */
    margin: 3%;
    font-size: 1.1rem;
}
.headingStyle {
	/* [disabled]font-family: 'montserrat', sans-serif; */
	/* [disabled]font-style: normal; */
	/* [disabled]font-weight: 400; */
	color: rgba(146,146,146,1.00);
	font-size: 32px;
}
.mainHeading {
	color: rgba(255,255,255,1.00);
	text-align: center;
	margin-top: 6%;
	font-size: 48px;
	text-shadow: 5px 6px 6px #86898D;
	background-image: url(url);
    
}
.mainTagline {
	text-align: center;
	color: rgba(226,225,221,1.00);
	font-size: 24px;
	margin-top: -1%;
	text-shadow: 2px 5px 3px #000000;
	font-weight: 100;
	text-decoration: none;
	text-transform: uppercase;
	/* [disabled]background-color: #010101; */
	letter-spacing: 2px;
	height: 81px;
	padding-top: 3px;
}
/*rotatingcircletext*/
.circle{
    position:relative;
    width:200px;
    height:200px;
    border-radius:50%;
  
    backgound:#ccc;
    display:flex;
    justify-content: center;
    align-items:center;
        
    

}

.logo_circle{
    position:absolute;
    width:150px;
    height:150px;
    background: url( "images/gglogotogether.jpg");
        background-size:cover;
    border-radius:50%;
   
}

	.text{
    position: absolute;
    width: 100%;
    height: 100%;
    font-family: 'montserrat', sans-serif;
    font-style: normal;
    
    font-weight: 600;
    color: rgba(89,89,89,1.00);
    font-size: 0.9rem;
       
    animation: textRotation 22s linear infinite;
    ;
}
.text span{
    position:absolute;
    left:50%;
    
    transform-origin:0 100px;
}
@keyframes textRotation {
	to {
		transform: rotate(360deg);
	}
}
.sectionText {
	text-align: center;
	font-weight: 500;
    font-size:2rem;
	color: #ffffff;
	background-color: #d2cac1;
}
.flower{
    width:40%;
    margin-left:35%;
    margin-right:35%;
    margin-bottom:2%;
    box-shadow: 6px 9px 33px #909090;
    background-color: #ffffff;
    padding-left:0.9rem;
    padding-top:0.9rem;
    padding-right:0.9rem;
    padding-bottom:0.9rem;
    float:left;
}
.heroHeader{
    margin-bottom:4%;
    height:300px;
     
    background-image: url(images/pip_contact.png);
    box-shadow: 6px 9px 33px #909090;

}

    
#sectionOne {
	text-align: justify;
}
#sectionTwo {
	text-align: justify;
}

#sectionthree {
	text-align: justify;
}

/* Gallery styles */
.gallery{
    padding-top:20px;
    padding-bottom:30px;
}
.textContainer{
    font-family: 'montserrat' , sans-serif;
	color: rgba(116,115,115,1.00);
	font-style: normal;
	font-weight: 400;
	font-size: 19px;
    width:60%;
    margin-left:20%;
    Margin-right:20%;
    
}
.FIEback{
  font-family: 'montserrat' , sans-serif;  
}
.contentArea{
	font-size: 14px;
	font-family: montserrat;
	font-style: normal;
	font-weight: 100;
	color: rgba(250,243,243,1.00);
	line-height: 1.8;
	text-align: center;
	margin-left: 5%;
	margin-right: 5%;
}
.showAreaH2 {
    
	color: #1E1E1E;
	margin-top: -75px;
	font-weight: bolder;
}
#secondaryStyling {
	padding-top: 20px;
    padding-bottom: 20px;
}
.secondarySection {
	background-color: rgba(0,0,0,1.00);
}
.secondaryHeading {
	color: rgba(255,255,255,1.00);
	text-align: center;
}
/*Footer styles*/
.footerTitle {
	text-align: center;
	font-size: 22px;
	color: #000000;
}
.footerTextContainer {
	text-align: justify;
	margin-bottom: 10%;
}
.gritgraphicsfont {
	width: 139px;
	background-color: #030303;
	text-align: center;
	float: left;
	border-radius: 0;
	padding: 5px;
	margin-top: 4px;
}
.parafooter {
	font-size: medium;
	color: #626161;
	font-family: alice;
	font-style: normal;
	font-weight: 400;
}
.maillink{
    color:#000000;
    
}



.Customer_form form input, textarea{
    width:50%;
    
    Background-color:#0000000;
   padding:2%;
    margin:2%;
    
}


@media (max-width:450px){
    
    .gridContainer{
        width:100%;
    }
   
 /*for the love of design*/   
    .logo {
	visibility: hidden;
	display: none;
    }
    
    .topNav{
        
        width:100%;
    }
    
    /* Navigation styles*/
.topNavUl {
    position: static;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #d2cac1;
    margin-top: -1px;   
  
}
.topNavLI {
	text-align: center;
    width:20%;
    
}

ul{
	margin:0px;
	padding:0px;
	list-style:none;
}
ul li{
width:200px;

	opacity:.5;
	text-decoration: none;
	line-height: 40px;
	text-align: left;
	font-size: small;
	background-color:#d2cac1;	
	font-family:'montserrat',sans-serif;align-content: center;
}
	



ul li a{
	text-decoraion: none;
	
	display: block;
	text-decoration: none;
	background-color: #d2cac1;
	
	
}

ul li ul li{
	display: none;
	opacity:.8;
	
} 
ul li:hover ul li{
	display: block;

	
	text-align: center;
}
    .showAreaH2{
      margin-top:5%;    
    }
   
  
    .headingStyle{
        margin-top:5%;
    }
  
    
   p{
	font-size: 1.1rem;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-style: normal;
	font-weight: bolder;
	color: rgba(251,247,248,1.00);
	line-height: 0.9;
} 
    tiles {
    clear: none;
    width: 30.153%;
    margin-left: 1.6949%;
    display: block;
    padding-bottom: 10px;
}
    #sectionOne{
        width:80%;
        display:block;
        margin-bottom: 5%;
    }
    #sectionTwo{
       width:80%;
        display:block;
    }
    .sectionText{
        margin-bottom: 9%;
        magin-left:5%;
        margin-right:5%;
    }
    .flower{
        width:50%;
        margin-right:10%;
        margin-left:10%;
    }
    .phoneimg{
       visibility:hidden;
        display:none;
        
    }
    .instagramimg{
      visibility:hidden;
        display:none;  
    }
    .emailimg{
        visibility:hidden;
        display:none;
        
    }
    .facebookimg{
         visibility:hidden;
        display:none;
    }
    
    
    .tiles{
        width:80%;
        margin-left:10%;
        margin-right:10%;
    }
    .FIEback{
        visibility:hide;
        display:none;
    }
    .textContainer{
    font-family: 'montserrat' , sans-serif;
    color: rgba(116,115,115,1.00);
    font-style: normal;
    font-weight: 400;
    font-size: 19px;
    width: 60%;
    margin-left: 20%;
    Margin-right: 20%;    
}
    .Gritgraphics_branding_process{
    
    margin-left:3%;
   margin-right:3%;
    padding-top:0;
    width:90%;
   
    Height:auto;
    border:#7499C6 2px;
    padding: 2px;
    border:4px solid #ffffff;
    height:auto;
    box-shadow: 0.2rem 0.2rem 1rem rgba(0,0,0,0.4);
    
}
 .copyright{
        float:right;
        font-size:1.2rem;
     font-weight:400;
        color:#727272 ;
     font-family: 'montserrat' , sans-serif;
     
    }
}
    
    
    
/*Desktop screen*/
@media screen and (min-width:760px){
    
   
    
.gridContainer {
    width: 85%;
    max-width: 1232px;
    margin-left: ;
    margin-right: ;
    margin: auto;
    clear: none;
    float: none;
    margin-left: auto;
}
/* Header & HERO styles*/
    .heroHeader {
    background-image: url(images/pip_contact.png);
    box-shadow: 6px 9px 33px #909090;
}

.logo {
	
	margin-top:0px;
text-align: center;
    font-family: 'montserrat', sans-serif;
	padding-top: 20px;
    padding-bottom:20px;
	width: 18%;
	background-color:#E8E3DD;
	font-size: 13px;
    margin-right:0;
    margin-left:0;
    float: left;
  display: inline-block;
}
/* Navigation styles*/
.topNav {
	width: 40%;
	clear: none;
	margin-left: 25.542%;
     float:right;
}
    
.topNavUl {
    position: static;
    padding-top: 8px;
    padding-bottom: 8px;
    background-color: #d2cac1;
    margin-top:0;
     width: 100%;
  
}
.topNavLI {
	width: 17%;
	margin-left: 7.1428%;
	clear: none;
	height: auto;
	position: static;
    text-align: center;
    }
   

ul{
	margin:0px;
	padding:0px;
	list-style:none;
}
ul li{
width:200px;

	opacity:.8;
	text-decoration: none;
	line-height: 40px;
	text-align: left;
	font-size: small;
	background-color:#d2cac1;	
	font-family:'montserrat',sans-serif;
    align-content: center;
}
	



ul li a{
	text-decoraion: none;
	
	display: block;
	text-decoration: none;
	background-color: #d2cac1;
	opacity: .8;
	
}

ul li ul li{
	display: none;
	opacity:.8;
	
} 
ul li:hover ul li{
	display: block;

	
	text-align: center;
}
/* Main heading styles*/

.mainHeading {
}
.mainTagline {
}

/* Text & content area styles*/
.textContainer {
    padding-top: 2%;
    padding-bottom: ;
    color: rgba(76,75,75,1.00);
    width: 60%;
}

#sectionOne {
    width: 40%;
    margin-left: 30%;
}
#sectionTwo {
	width: 40.6779%;
	margin-left: 1.6949%;
	clear: none;
	display: block;
}
.secondarySection {
	width: 49.1525%;
	clear: none;
	margin-left: 1.6949%;
	display: block;
}
.secondaryHeading {
	margin-left: 0;
	width: 100%;
}

/* Gallery styles*/
.tiles {
    width: 30.203%;
    clear: none;
    margin-left: 1.6949%;
    display: block;
    padding-bottom: 60px;
}
/* Footer styles*/
.footer {
}
.footerSection {
	width: 32.2033%;
	clear: none;
	margin-left: 1.6949%;
	display: block;
}
.footerTitle {
	margin-left: 0;
	width: 100%;
    margin-top: 5%;
}
.gallery {
}
.showAreaH2 {
	text-align: center;
}
.zeroMargin_desktop {
margin-left: 0;
}
.hide_desktop {
display: none;
}

.gglogo {
    width: 20%;
}
.phoneimg {
	padding-bottom: 7px;
    margin-left:5%;
    margin-right:5%;
	left: auto;
	right: auto;
    width:90%;
    height:30%;
        margin-left:85%;
}
.instagramimg {
	padding-bottom: 7px;
	left: auto;
	right: auto;
     width:20%;
    height:20%
}

.emailimg {
	padding-bottom: 7px;
	left: auto;
	right: auto;
     width:90%;
    height:90%;
     margin-left:95%;
   
}

.quote {
	font-size: 80%;
	background-color: #EAEAE2;
	font-family: montserrat;
}
.maintagbckclr {
	opacity: 1;
	-webkit-box-shadow: 0px 0px 0px;
	box-shadow: 0px 0px 0px;
}
.maillink {
	color: #000000;
    font-family: 'montserrat' , sans-serif;
	color: rgba(75,74,74,1.00);
	font-style: normal;
	font-weight: 400;
	font-size: 1.8rem;
}

    .gridContainer {
    width: 100%;
}
    

p.paraContent{
	font-size: 28px;
	font-family: montserrat;
	font-style: normal;
	font-weight: 400;
	color: rgba(69,67,67,1.00);
	line-height: 1.8;
	margin-left: 5%;
	margin-right: 5%;
	align-content: center;
	text-align: center;
}
    .Gritgraphics_branding_process{
    
    margin-left:20%;
   margin-right:20%;
    padding-top:0;
    width:55%;
   
    Height:auto;
    border:#7499C6 2px;
    padding: 2px;
     border:4px solid #EA8939;
    height:auto;
    box-shadow: 0.2rem 0.2rem 1rem rgba(0,0,0,0.4);
    
}
 .copyright{
        float:right;
        font-size:1.2rem;
     font-weight:400;
        color:#727272 ;
     font-family: 'montserrat' , sans-serif;
     
    }
    .orange_mug{
        width:20%;
        margin-bottom:3%;
        
    }

}

/*tablet screen*/
@media screen and (max-width : 760px ){

   
    
    .gridContainer {
	width: 100%;
	
	
}
    .heroHeader {
    height: 300px;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    background-image: url(images/pip_contact.png);
    box-shadow: 6px 9px 33px #909090;
}
   
    
    .logo {
	visibility: hidden;
	display: none;

    }
    .topNav {
	width: 100%;
	margin-left: 0;
	clear: both;
       
   
}
    /* Navigation styles*/
.topNavUl {
    position: static;
    padding-top: 8px;
    padding-bottom: 8px;
    background-color: #d2cac1;
    margin-top:0;
  
}
.topNavLI {
	text-align: center;
    width:23%;
   
    
}

ul{
	margin:0px;
	padding:0px;
	list-style:none;
}
ul li{
width:200px;

	opacity:.8;
	text-decoration: none;
	line-height: 40px;
	text-align: left;
	font-size: small;
	background-color:#d2cac1;	
	font-family:'montserrat',sans-serif;align-content: center;
}
	



ul li a{
	text-decoraion: none;
	
	display: block;
	text-decoration: none;
	background-color: #d2cac1;
	opacity: .8;
	
}

ul li ul li{
	display: none;
	opacity:.8;
	
} 
ul li:hover ul li{
	display: block;

	
	text-align: center;
}
    p{
	font-size: 13px;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-style: normal;
	font-weight: bolder;
	color: rgba(251,247,248,1.00);
	line-height: 1.8;
}
    /* Text & content area styles*/
.textContainer {
    padding-top: 16px;
}
    .flower{
        width:40%;
        margin-left:15%;
        margin-right:15%;
    }
#sectionOne {
	width: 80%;
    margin-left: 10%;
    margin-right: 10%;
}
#sectionTwo {
	clear: none;
	width: 50%;
    margin-left: %;
	display: block;
}
.tiles {
    clear: none;
    width: 30.153%;
    margin-left: 1.6949%;
    display: block;
    padding-bottom: 10px;
}
.secondarySection {
	clear: none;
	width: 49.1525%;
	margin-left: 1.6949%;
	display: block;
}
.secondaryHeading {
	width: 100%;
	margin-left: 0;
}
/* Footer styles*/
.footer {
}
.footerSection {
	clear: none;
	width: 32.2033%;
	margin-left: 1.6949%;
	display: block;
}
.footerTitle {
     margin-top: 20%;
}
.gallery {
}
.showAreaH2 {
}
.hide_tablet {
display: none;
}
.zeroMargin_tablet {
margin-left: 0;
}
    .paraContent{
	font-size: 1.2rem;
	font-family: montserrat;
	font-style: normal;
	font-weight: 400;
	color: rgba(69,67,67,1.00);
	line-height: 1.8;
	margin-left: 5%;
	margin-right: 5%;
	align-content: center;
	text-align: center;
}
    .showAreaH2{
    margin-top: 9%;
    font-size: 1.7rem;
    }
    .facebookimg{
        width:30%;
        height:30%;
    }
    .instagramimg{
        width:90%;
        height:90%;
    }
    .emailimg{
        width:90%;
        height:90%;
        padding-left:90%;
    }
    .phoneimg{
        width:90%;
        height:90%;
        padding-left:90%;
    }
    .textContainer{
    font-family: 'montserrat' , sans-serif;
	color: rgba(75,74,74,1.00);
	font-style: normal;
	font-weight: 400;
	font-size: 19px;
    width:60%;
    margin-left:20%;
    Margin-right:20%;
    
}
    .Gritgraphics_branding_process{
    
    margin-left:20%;
   margin-right:20%;
    padding-top:0;
    width:60%;
   
    Height:auto;
    border:#7499C6 2px;
    padding: 2px;
    border:4px solid #000000;
    height:auto;
    box-shadow: 0.2rem 0.2rem 1rem rgba(0,0,0,0.4);
    
}
 .copyright{
        float:right;
        font-size:1.2rem;
     font-weight:400;
        color:#727272 ;
     font-family: 'montserrat' , sans-serif;
     
    }
     .orange_mug{
        width:20%;
        margin-bottom:3%;
        
    }
}
/*phone*/
@media screen and (max-width : 450px ){
    
      .heroHeader {
    background-image: url(images/pip_contact.png);
    box-shadow: 6px 9px 33px #909090;
          height:100px;
}
      .callus{
        visibility:hidden;
        display:none;
    }
    .mainTagline{
         visibility:hidden;
        display:none;
    }
    .gglogo{
         visibility:hidden;
        display:none;
    }
     .topNav{
        
        width:100%;
    }
    
    /* Navigation styles*/
.topNavUl {
    position: static;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #d2cac1;
    margin-top: -1px;   
  
}
.topNavLI {
	text-align: center;
    width:20%;
    
}

ul{
	margin:0px;
	padding:0px;
	list-style:none;
}
ul li{
width:200px;

	opacity:.5;
	text-decoration: none;
	line-height: 40px;
	text-align: left;
	font-size: small;
	background-color:#d2cac1;	
	font-family:'montserrat',sans-serif;align-content: center;
}
	



ul li a{
	text-decoraion: none;
	
	display: block;
	text-decoration: none;
	background-color: #d2cac1;
	
	
}

ul li ul li{
	display: none;
	opacity:.8;
	
} 
ul li:hover ul li{
	display: block;

	
	text-align: center;
}
       
    .Gritgraphics_branding_process{
    
    margin-left:5%;
   margin-right:5%;
    padding-top:0;
    width:90%;
   
    Height:auto;
    border:#7499C6 2px;
    padding: 2px;
    border:4px solid #000000;
    height:auto;
    box-shadow: 0.2rem 0.2rem 1rem rgba(0,0,0,0.4);
    
}
        .textContainer{
    font-family: 'montserrat' , sans-serif;
	color: rgba(75,74,74,1.00);
	font-style: normal;
	font-weight: 400;
	font-size: 19px;
    width:90%;
    margin-left:4%;
    Margin-right:4%;
    
}
    
        /*rotatingcircletext*/
.circle{
    position:relative;
    width:200px;
    height:200px;
    border-radius:50%;
  
    backgound:#ccc;
    display:flex;
    justify-content: center;
    align-items:center;
        
    

}

.logo_circle{
    position:absolute;
    width:150px;
    height:150px;
    background: url( "images/gglogotogether.jpg");
        background-size:cover;
    border-radius:50%;
   
}

	.text{
    position: absolute;
    width: 100%;
    height: 100%;
    font-family: 'montserrat', sans-serif;
    font-style: normal;
    
    font-weight: 600;
    color: rgba(89,89,89,1.00);
    font-size: 0.9rem;
       
    animation: textRotation 22s linear infinite;
    ;
}
.text span{
    position:absolute;
    left:50%;
    
    transform-origin:0 100px;
}

@keyframes textRotation {
	to {
		transform: rotate(360deg);
	}
    }
   
  
    }