@media (max-width:960px) {
#header, #wrapper, #banner, #bunker, #footer { max-width: 960px; width: 94%; margin: 0 auto; position: relative }
#services { height: auto }
#services div { width: 238px; }
#intro #i0 { margin: 0 0 0 0; }
#intro #i1 { margin: 14px 0 0; }
#nav { max-width: 960px; width: 100%; margin: 0 auto; }
#banner img { float: right; height: auto; max-width: 100%; width: 62.4%; }
.adrow div { width: 25% }
.adrow2 div { width: 25% }
.adrow3 div { width: 25% }
img { max-width: 100%; height: auto }
.client-logo ul { margin-bottom: 22px; padding-top: 10px; text-align: center; }
.client-logo ul li { padding-right: 50px !important; width: 19%; }
#main-nav a { border: 0px solid rgba(0, 0, 0, 0); display: block; padding: 5px 0px 5px 5px; }
#banner h1 span { color: #3c74b6; font-size: 45px; }
.support-ser { margin-top: 15px; }
.adrow { height: auto }
.client-logo ul li:nth-child(13) { padding-top: 20px }
#content { max-width: 880px; width: 100%; padding: 20px 0 10px; }
#footer #f1 { float: right; margin: 0 27px 0 0; text-align: right; width: 191px; }
#footer #f0 { width: auto }
.prow,.prowE,.prowH { max-width: 844px; width: 100%; height: auto }
.prow0,.prow0E { height: auto; width: 30.8%; }
.prow0:nth-child(3n+3),.prow0E:nth-child(3n+3) { margin-right: 0; }
#prevLink, #nextLink { height: 50% !important; }
#imageData #bottomNavClose { z-index: 999; }
.social-media { line-height: 50px; }
#services ul li { white-space: normal }
#main-nav a { border: 1px solid #F5F5F5 }
}

/*------------tablet portrait  view------*/
 
@media (max-width:900px) {
#main-nav a { font-size: 13.5px; }
#banner h1 span { color: #3c74b6; font-size: 40px; }
.gamma-gallery li { width: 30% !important }
}

@media (max-width:800px) {
#main-nav a { font-size: 13px; }
#banner h1 { font-size: 32px; line-height: 110%; margin: 0 0 8px; padding: 20px 0 0; }
#footer #f0 { float: none; text-align: center; width: auto; margin: 0 0 7px; }
#footer #f1 { float: none; margin: 0 auto; text-align: center; width: 183px; padding-bottom: 10px; }
#outerImageContainer { background-color: #ffffff; height: auto !important; margin: 0 auto; position: relative; width: 94% !important; }
#imageDataContainer { width: 94% !important; }
#services { background-position: 162px 20px; background-size: 54% auto; }
#services div { width: 180px; }
#services div h3 { font-size: 23px; margin: 0 auto; }
#services ul { background-image: none; margin-bottom: 0; margin-left: 27px !important; text-align: center; }
#services ul li { font-size: 14px; }
.support-ser { margin-top: 0 }
}

@media (max-width:768px) {
#services { background-position: 155px 20px; background-size: 56% auto; }
#services div { width: 177px; }
#services div h3 { font-size: 23px; margin: 0 auto; }
#services ul { background-image: none; margin-bottom: 0; margin-left: 27px !important; text-align: center; }
#services ul li { font-size: 14px; }
.support-ser { margin-top: 0 }
.gamma-gallery li { height: 180px }
.gamma-nav span { top: 42%; }
#arl-mainContent iframe {
  height: 270px;
  width: 409px;
}
}

/*------------mobile landscape  view------*/
@media (max-width:767px) {
#main-nav a { border: 0px solid #F5F5F5 }
html { overflow-x: hidden !important }
#banner img { float: right; height: auto; max-width: 100%; width: 100%; }
#banner { height: auto; }
#banner h1 br { display: none; }
#banner h1 span { display: block; color: #3c74b6; font-size: 40px; }
#services { background: #f4f4f4; border-radius: 8px; border: 1px solid #dbdbdb; padding-top: 30px }
#services div { width: 100%; float: none; height: auto; margin-bottom: 20px; }
#services ul { margin-left: 0 !important; }
#services ul li { text-align: center; }
.services-arrow { background: url(../imgs2/services-arrow.png) no-repeat center 0; height: 64px; display: block }
.adrow div, .adrow2 div, .adrow3 div { text-align: center; width: 50%; }
#intro #i0 { margin: 0; float: none; margin: 0 auto; text-align: center; }
#i0 > a { display: block; margin: 0 auto; padding-bottom: 10px; text-align: center; width: 168px; }
#intro #i1 { float: none; margin: 14px 0; text-align: center; }
#intro { height: auto }
.menu-icon { background: url("../imgs2/menu-small.png") no-repeat scroll left center; cursor: pointer; display: block; float: left; height: 30px; position: absolute; left: 0px; top: 20px; width: 35px; }
#nav { background: none; border: 0; border-radius: 0; height: auto }
#banner { padding-top: 0 }
.menu { left: -260px; background: #F5F5F5; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; height: 100%; top: 0px; width: 260px; position: fixed; overflow-y: scroll; z-index: 9999; overflow-x: hidden }
body { left: 0; position: relative; transition: all 0.3s ease 0s; overflow-x: hidden; }
body.cbp-spmenu-open { overflow: hidden !important; -webkit-overflow-scrolling: touch; }
.menu.cbp-spmenu-open { left: 0px; }
#showRight.active { left: 0px; }
body.cbp-spmenu-open #wrapper { margin-left: 213px !important; }
.menu li { float: left; width: 100%; background: none; padding: 0; margin: 0 !important; box-sizing: border-box; border-top: 1px solid #4f4f4f }
.menu li a { text-align: center; display: block; color: #4f4f4f; padding: 28px 0 28px 48px; font-size: 26px; text-align: left; background: #F5F5F5; margin-bottom: 0; border-bottom: 1px solid #fff; }
menu li.last a { border: 0; }
.menu { width: 200px; }
#main-nav li:hover a { background: none !important; border: 0px solid #f5f5f5 !important; }
#main-nav .sub-menu { display: block; left: 0; opacity: 1; position: relative; width: 100%; float: left }
.arrow { background: url("../imgs2/plus.png") no-repeat center 6px; float: right; height: 30px; width: 40px; cursor: pointer }
.arrow.up { background: url("../imgs2/minus.png") no-repeat scroll center 6px; float: right; height: 30px; width: 40px; }
#main-nav .menu li:hover a, #main-nav .sub-menu a { border: 0 }
#main-nav li:hover ul li a:hover { transform: none }
#main-nav li:hover ul li a:hover { /* Set styles for dropdown when items are hovered */ background: none; border: 0px solid transparent; box-shadow: none; color: #4f4f4f }
#main-nav .menu li:hover a, #main-nav .sub-menu a { box-shadow: none; }
#main-nav .sub-menu a { font-size: 1em; white-space: normal; border-radius: 0; }
#main-nav .sub-menu li { padding: 0; border: 0; word-wrap: break-word; }
#main-nav .sub-menu a { font-size: 13px; padding-left: 12px; white-space: normal; }
#main-nav a { font-size: 14px; }
.side { background-color: #f5f5f5; border: 1px solid #dbdbdb; border-radius: 15px; float: none; margin: 0 0 10px; padding: 15px 0 10px; position: relative; right: 0; width: 100%; z-index: 5; }
div.hr100 { margin: 0em auto 2em }
#pgfoot { margin: 0 }
#main-nav > ul { float: none }
.gamma-single-view .gamma-description { display: block; }
}

/*------------mobile portrait view------*/

@media (max-width:720px) {
.prow0,.prow0E { height: auto; width: 30%; }
.gamma-description h3 { box-sizing: border-box; color: #ffffff; font-size: 14px; font-weight: 400; letter-spacing: 1px; padding: 10px 20px; text-transform: uppercase; width: 100%; }
.mfp-image-holder .mfp-content { background: none repeat scroll 0 0 rgba(0, 0, 0, 0); box-shadow: none; max-width: 100%; width: 80%; }
.mfp-figure:after { box-shadow: none !important; background: none !important; }
}

@media (max-width:640px) {
.gamma-gallery li { width: 29% !important; }
}

@media (max-width:533px) {
.prow0,.prow0E { height: auto; width: 100%; margin: 0 auto; float: none; text-align: center; }
.gamma-gallery li { margin: 0 auto; position: relative !important; width: 50% !important; float: none; height: 110px; }
.prow a, .prowE a { display: inline-block; position: relative; }
.gamma-description { width: 100%; }
}

/*----------optional css------*/
@media (max-width:480px) {
.client-logo ul li { padding-right: 32px !important; width: 31%; }
.right { float: none; margin: 0 0 10px; width: 100%; }
#pagetitle { font-size: 24px; margin-bottom: 20px; }
.mfp-image-holder .mfp-content { width: 70%; }
}

@media (max-width:479px) {
.adrow div, .adrow2 div, .adrow3 div { text-align: center; width: 100%; }
.gamma-gallery li { float: none; height: 100px; margin: 0 auto; position: relative !important; width: 60% !important; }
.mfp-close { height: 24px !important; line-height: 24px !important; right: 9px !important; top: 11px !important; width: 24px !important; }
}

@media (max-width:375px) {
}

@media (max-width:360px) {
#-speakpipe-dialog-container { width: 74% !important }
#_speakpipe_labs_recorder_frame { width: 100% !important }
#_speakpipe_labs_recorder_frame .-speakpipe-dialog-title { width: auto !important; }
h2 { text-align: center; font-size: 30px }
#banner h1 { text-align: center; }
#banner p { font-size: 21px; text-align: center; }
.-speakpipe-dialog-title { width: auto !important; }
.gamma-gallery li { margin: 0 auto; position: relative !important; width: 265px !important; float: none; height: 110px; }
}

@media (max-width:320px) {
.gamma-nav span { top: 47%; }
}

@media all and (-webkit-min-device-pixel-ratio: 1.5) {
.arrow { background-image: url(../imgs2/plus@2x.png); background-size: 20px 20px }
.arrow.up { background-image: url(../imgs2/minus@2x.png); background-size: 20px 20px }
.menu-icon { background-image: url(../imgs2/menu-small@2x.png); background-size: 35px 30px }
}
 

/*include browser specific css styles here*/
