/***************

START Media Queries  WHEN PAGE WIDTH LESS THAN 1040 IS ACTIVE (FOR TABLET)

***************/

@media handheld and (max-width: 1040px),

   screen and (max-device-width: 1040px),

   screen and (max-width: 1040px) 

	{







/* HEADER */



#header-fix-space { display: none; }



#fixed-header	{

		background-color: #fff;

		position: absolute;

		top: 0;

		left: 0;

		}



.header		{ position: absolute; }





/* HOME 3 BOX COLUMNS */



.introbox-text	{ font-size: 14px; }



.intro		{ font-size: 22px; }



.introbox-inner	{ margin-top: 30px; margin-bottom: 30px; }





/* PROJECT PAGES */



.project-overlay-1	{ font-size: 22px; margin-bottom: 6px; }



.project-overlay-2	{ font-size: 18px; line-height: 120%; margin-bottom: 6px; }



.project-overlay-3	{ font-size: 18px; }



#descriptionwrapper	{ width: 80%; top: 70%; }





	}

/***************

END Media Queries 

***************/















/***************

START Media Queries #1 WHEN PAGE WIDTH LESS THAN 890 IS ACTIVE (FOR TABLET)

***************/

@media handheld and (max-width: 890px),

   screen and (max-device-width: 890px),

   screen and (max-width: 890px) 

	{





.logo-respond	 { width: 100%; height: auto; }



.floatlist	 { width: 100%; }



#contentbox	 { max-width: 720px; }





.hidemobile	{ display: none; }



.showmobile	{ display: block; }







/* PROJECT PAGES */



.project-overlay-1	{ font-size: 18px; margin-bottom: 6px; }



.project-overlay-2	{ font-size: 15px; line-height: 120%; margin-bottom: 6px; }



.project-overlay-3	{ font-size: 14px; }



#descriptionwrapper	{ width: 80%; top: 75%; }





/* HOME BOX COLUMNS */



.introbox-text	{ font-size: 12px; }



.introbox-text, .intro, .boxes2	  { text-align: center; }



.introbox-outer	  { max-width: 425px; margin: 0 auto; }



.introbox2	  { width: 100%; float: none; margin: 0 auto; }

.introbox3	  { width: 100%; float: none; margin: 0 auto; }



.introbox-inner	  { padding: 30px 0px 0px 0px; margin: 0px 0px 0px 0px; }



.introbox-left	  { display: block; }



.introbox-center  { display: block; }



.introbox-right	  { display: block; }







	}

/***************

END Media Queries #1

***************/







/***************

START Media Queries #2 WHEN PAGE WIDTH LESS THAN 740 IS ACTIVE

***************/

@media handheld and (max-width: 740px),

   screen and (max-device-width: 740px),

   screen and (max-width: 740px) 

	{





.hidemobile	{ display: none; }



.showmobile	{ display: block; }



#contentbox-home	{ width: 100%; }





/* HEADER */



#header-fix-space { display: none; }



#fixed-header	{

		background-color: #fff;

		position: absolute;

		top: 0;

		left: 0;

		}



.header		{ position: absolute; }





.logo-respond	{ max-width: 300px; height: auto; }





/* PORTFOLIO INDEX PAGE */



.portfolio-overlay-text	{ font-size: 36px; }



/* PROJECT PAGES */



.project-overlay-1	{ font-size: 18px; margin-bottom: 6px; }



.project-overlay-2	{ font-size: 16px; line-height: 120%; margin-bottom: 6px; }



.project-overlay-3	{ font-size: 14px; }



#descriptionwrapper	{ width: 80%; top: 85%; }





/* PROJECT LIST PAGE */



.float-project	{ float: none; width: 100%; margin: 0 auto; padding: 12px; }



.project-subtitle { font-size: 18px; } 







/* PAGE 2 COLUMN TEXT */



.content-outer	{ max-width: 700px; padding: 10px; }



.content	{ float: none; }



.content-left, .content-right  { float: none; width: 100%; padding: 15px 5px 15px 5px; }







.intro		{ font-size: 18px; }







	}

/***************

END Media Queries #2

***************/









/***************

START Media Queries #3 -  WHEN PAGE WIDTH LESS THAN 482 IS ACTIVE

                      CLASSES HERE CAN ALSO BE FOUND IN THE style.css

***************/

@media handheld and (max-width: 482px),

   screen and (max-device-width: 482px),

   screen and (max-width: 482px) 

	{







/* MQS FONTS - NEXT LINE IS DEFAULT MOBILE FONT ALL PAGES */



body, div, table { font-size: 14px; line-height: normal; }



.title  	{ font-size: 20px; }



.subtitle  	{ font-size: 17px; }



.smalltext 	{ font-size: 12px; }



.just 		{ text-align: left; }





.hidemobile	{ display: none; }



.showmobile	{ display: block; }







/* MQS PAGE & CONTENT HEIGHTS, PADDING & WIDTHS */



.pageheight		{ min-height: 50px; }



.pagebox		{ padding: 0px 0px 0px 0px; }



#contentbox		{ padding: 10px 0px 10px 0px; }



.content-pad		{ padding: 10px 5px 10px 5px; }



#contentbox-home	{ padding: 10px 0px 10px 0px; }



.content-pad-home	{ padding: 10px 5px 10px 5px; }







/* HEADER */



#logo		{ max-width: 190px; min-width: 190px;  margin-top: 5px; }



#menu		{ margin-top: 5px; margin-right: 5px; }



.logo-respond	{ max-width: 190px; height: auto;  }





/* HEADER */



#header-fix-space { display: none; }



#fixed-header	{

		background-color: #fff;

		position: absolute;

		top: 0;

		left: 0;

		}



.header		{ position: absolute; }







/* MQS LIST */



.list	{ font-size: 14px; }





/* HOME PAGE SLIDESHOW TEXT OVERLAY */



.home-overlay-1	{ font-size: 24px; }



.home-overlay-2	{ font-size: 18px; }



.home-overlay-3	{ font-size: 12px; }





/* MQS FOOTER */



.footer-copyright { font-size: 11px; }





/* PROJECT PAGES */



.project-overlay-1	{ font-size: 14px; margin-bottom: 0px; line-height: 110%; text-align: center; }



.project-overlay-2	{ font-size: 16px; margin-bottom: 0px; text-align: center; }



.project-overlay-3	{ font-size: 13px; margin-bottom: 15px; text-align: center; }



.projecttext {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

	}



#descriptionwrapper	{ top: 90% }





.portfolio-overlay-text { font-size: 22px; }





/* PROJECT LIST PAGE */



.float-project	{ float: none; width: 100%; max-width: 280px; margin: 0 auto; padding: 0px; }



.project-list	{ font-size: 14px; line-height: 125%; margin-top: 6px; }





	}

/***************

END Media Queries #3

***************/









/***************

START Media Queries #4 -  WHEN PAGE WIDTH LESS THAN 488 IS ACTIVE AND ORIENTATION IS LANDSCAPE

                      CLASSES HERE CAN ALSO BE FOUND IN THE style.css

***************/

@media handheld and (max-height: 300px),

   screen and (max-device-height: 300px),

   screen and (max-height: 300px) {



.logo-respond { max-width: 200px; height: auto; }

  

/* HOME PAGE SLIDESHOW TEXT OVERLAY */



.landscape { margin-top: 150px; }



.landscape2 { margin-top: 25px;  }



.just 	{ text-align: left; }





/* HEADER */



#header-fix-space { display: none; }



#fixed-header	{

		background-color: #fff;

		position: fixed;

		top: 0px;

		left: 0px;

		}





	}

/***************

END Media Queries #4

***************/