/* CSS Document Copyright Jodi Head) */
@media screen and (max-width:960px) {

	#wrapper { margin: 0 auto; width: 660px;}
	.line { margin-left: auto; margin-right: auto; width: 388px; margin-top: 28px; margin-bottom: 28px; }
	a.nlink { text-decoration: none; margin-left: 16px; margin-right: 16px; }
	
	
}
@media screen and (max-width:798px) {
	
	
	

	#wrapper { margin: 0 auto; width: 94%;}
#logo { padding: 0; margin-top: 0; margin-bottom: 0; margin-left: auto; margin-right: auto }

#wrapper { margin: 0 auto; width: 660px;}
.line { margin-left: auto; margin-right: auto; width: 388px; margin-top: 28px; margin-bottom: 28px; }
a.nlink { text-decoration: none; margin-left: 14px; margin-right: 14px; }

#text { width: 90%; text-align: center; margin-left: auto; margin-right: auto; padding-top: 0px; }
#text2 { width: 90%; text-align: center; margin-left: auto; margin-right: auto; padding-top: 30px !important; margin-top: 0; margin-bottom: 0px; padding-bottom: 50px !important; }
#text2 p { text-align: center; height: auto; }
#text3 { width: 90%; text-align: center; margin-left: auto; margin-right: auto; padding-top: 60px; margin-top: 0; padding-bottom: 60px; }
#text4 { width: 100%; text-align: center;  margin-left: auto; margin-right: auto; padding-top: 60px; margin-top: 0; padding-bottom: 30px; }
#text6 { width: 90%; text-align: center; margin-left: auto; margin-right: auto; padding-top: 30px; }
#text7 { width: 90%; text-align: center; margin-left: auto; margin-right: auto; padding-top: px; }
#text8 { width: 90%; text-align: center; margin-left: auto; margin-right: auto; padding-top: 40px; }
#text9 { width: 90%; text-align: center; margin-left: auto; margin-right: auto; padding-top: 0px; }


#skills-wrapper { height: auto !important; padding-top: 30px; padding-bottom: 0px; margin: 0 }
#title-wrapper { width: 100%; margin-left: auto; margin-right: auto; height: auto; }
#contact-wrapper2 { width: 100%; margin-left: auto; margin-right: auto; height: auto; padding-top: 0px; padding-bottom: 0px; margin-top: 0px; }

#logo-wrapper { height: auto !important; padding-top: 30px; padding-bottom: 30px; margin: 0 }
#intro-wrapper { height: auto !important; padding-top: 40px; padding-bottom: 40px; margin: 0 }
#main-wrapper { height: auto !important; padding-top: 0px; padding-bottom: 0px; margin: 0 }
#specialisms-wrapper { height: auto !important; padding-top: 0px; padding-bottom: 0px; margin: 0 }
#contact-wrapper { width: 100%; margin-left: auto; margin-right: auto; height: auto; padding-top: 0px; padding-bottom: 30px; margin-top: 0px; }
#dotted-wrapper4 { height: 145px; }
#dotted-wrapper2 { height: auto; }
#dotted-wrapper3 { height: auto; }
#dotted-wrapper1 { height: auto; }
#dotted-wrapper6 { height: auto }

#contact1 { width: 280px; margin-left: auto; margin-right: auto; margin-top: 0px; padding-top: 50px; float: none; clear: both }
#contact2 { width: 395px; margin-left: auto; margin-right: auto; margin-top: 15px; float: none; clear: both }  /* 155 width with portfolio link */
#lefticon { float: none; margin: 0 0 12px 0; padding: 0 }

#nocapacity {  }
#nocapacity-text { width: 90%;  padding: 24px 0px 24px 0px; height: auto; }
#cv { position:absolute; top: 88px; z-index: 2 } /*0px if statement not there */

#warning {  }
#warning-text { width: 90%;  padding: 24px 0px 24px 0px; height: auto; }


}

@media screen and (max-width:660px) {

#cv-wrapper { padding-left: 30px; width: 86%; margin-left: auto; margin-right: auto }


#nocapacity {  }
#nocapacity-text { width: 90%;  padding: 24px 0px 24px 0px; }
#cv { display: none }



#col1 { width: 100%; text-align: center; margin-left: auto; margin-right: auto }
#col2 { width: 100%; text-align: center; margin-left: auto; margin-right: auto }
.col3 { width: 100%; margin-left: auto; margin-right: auto }
.col4 { width: 100%; margin-left: auto; margin-right: auto }
#msg4{ font-family: 'Montserrat', Arial, serif; font-weight: 400; font-size: 16px; line-height: 22px; color: #594c44; margin: 0; padding: 0; text-align: center }
.msg5 { font-family: 'Montserrat', Arial, serif; font-weight: 400; font-size: 14px; color: #594c44; margin-top: 12px; }
.line { height: 2px; margin-left: auto; margin-right: auto; width: 100%; margin-top: 28px; margin-bottom: 28px; background-image: url(images/jodihead-dotted.png); background-repeat: repeat-x; background-position: top center; }
a.nlink { text-decoration: none; margin-left: 12px; margin-right: 12px; }



}

@media screen and (max-width:600px) {



}

@media screen and (max-width:555px) {
	

#cv { position:absolute; top: 108px; z-index: 2; } /*0px if statement is not there */
.formtext { width: 240px !important; }
#text5 { width: 100%; text-align: center; margin-left: auto; margin-right: auto }

#popup_window{
padding: 0px;
background: #267E8A;
cursor: pointer;
margin: 0px;
}

.overlay .popup-overlay {
    opacity: 1;
    left: 0
}
.popup {
    position: fixed;
    top: 0;
    left: 0;
    z-index: -9999;
}
.popup .popup-body {
    
    opacity: 0;
    width: 90%;
    margin-left: auto;
	margin-right: auto;    padding: 20px;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transition: opacity .2s ease-out;
    -moz-transition: opacity .2s ease-out;
    -ms-transition: opacity .2s ease-out;
    -o-transition: opacity .2s ease-out;
    transition: opacity .2s ease-out;
    position: relative;
    text-align: center;
	overflow-y:scroll;
    height: 620px;
}
.popup h1 { padding-top: 12px; }
.popup h2 { text-align: center !important; line-height: 26px; }
.popup.visible, .popup.transitioning {
    z-index: 9999;
}
.popup.visible .popup-body {
    opacity: 1;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.popup .popup-exit {
	cursor: pointer;
	display: block;
	width: 24px;
	height: 24px;
	position: absolute;
	top: 19px;
	right: 20px;
	background: url("images/quit.png") no-repeat;
    
}
.popup .popup-content {
    
}
.popup-content .popup-title {
    border-bottom: 1px solid #e9e9e9;
    padding-bottom: 10px;
}


.line { height: 2px; margin-left: auto; margin-right: auto; width: 100%; margin-top: 28px; margin-bottom: 28px; background-image: url(images/jodihead-dotted.png); background-repeat: repeat-x; background-position: top center; }


.formleftwide { clear: both; text-align: center; width: 100%; margin-right: 0; margin-bottom: 5px; }
.formleftwide2 { clear: both; text-align: center; width: 100%; margin-right: 0; margin-bottom: 5px; height: auto; }
.formrightwide { clear: both; text-align: center; width: 100%; margin-right: 0; margin-bottom: 18px;  }
.formleftwide h2 { font-size: 16px; line-height: 22px; margin: 0px 0 0 0; padding: 0; text-align:left }
.formleftwide2 h2 { font-size: 16px; line-height: 22px; margin: 0px 0 0 0; padding: 0; text-align:left }

.formrightsm1 { clear: both; text-align: center; width: 100%; margin-right: 0; margin-bottom: 6px; font-family: 'Montserrat', Arial, serif; font-weight: normal; font-size: 14px; line-height: 28px; margin-right: 5% }
.formrightsm2 { clear: both; text-align: center; width: 100%; margin-right: 0; margin-bottom: 6px; font-family: 'Montserrat', Arial, serif; font-weight: normal; font-size: 14px; line-height: 28px; }

.formtext { width: 240px !important; height: 25px; }
.formtext2 { width: 240px !important; }

a.nlink { text-decoration: none; margin-left:8px !important; margin-right: 8px !important; font-size: 14px !important }
#cv-wrapper { margin:0; }

#nocapacity {  }
#nocapacity-text { width: 90%;  padding: 24px 0px 24px 0px; }

}

@media screen and (max-width:488px) {

#cv-wrapper { margin:0; display: none; }
#nocapacity-text { height: auto !important; }
.popup .popup-body {
	overflow-y:scroll;
    height: 488px;
}
.formrightwide input { clear: both; text-align: center; width: 100px; margin-right: 0; margin-bottom: 18px;  }
.formtext { width: 210px !important; height: 25px; }
.formtext2 { width: 210px !important; }

}

@media screen and (max-width:388px) {

a.nlink { text-decoration: none; margin-left:3px !important; margin-right: 3px !important; font-size: 14px !important }

.line { height: 2px; margin-left: auto; margin-right: auto; width: 100%; margin-top: 28px; margin-bottom: 28px; background-image: url(images/jodihead-dotted.png); background-repeat: repeat-x; background-position: top center; }
.msg1 { font-family: 'Montserrat', Arial, serif; font-weight: 400; font-size: 16px; color: #594c44; width: 100%; text-align:center; margin-left: auto; margin-right: auto }
#cv-wrapper { margin:0; display: none; }
.popup .popup-body {
	overflow-y:scroll;
    height: 380px;
}

#contact1 { font-size: 14px; width: 241px; }
#contact2 { font-size: 14px; width: 325px; }

.formtext { width: 180px !important; height: 25px; }
.formtext2 { width: 180px !important; }

}