body{
font-family: "robotomedium", Arial, "Helvetica Neue", Helvetica, sans-serif;
margin: 0;
padding: 0;
font-size: 18px;
color: #636363;
width: 100%;
}
.clear{
clear: both;
}
a:link{
color: #e05825;
text-decoration: none;
}
a:visited{
color: #e05825;
text-decoration: none;
}
a:hover{
color: #4a8bca;
text-decoration: none;
}
a:active{
color: #e05825;
text-decoration: none;
}

#wrapper{
margin: 0 auto;
}

/*header
----------------------------------------------------------------*/
#header{
margin: 35px 0 50px;
}
#top-nav{
float: left;
width: 600px;
margin: 30px 0 0 60px;
list-style:none;
position:relative;
z-index:5;
font-family: "ostrich_sansblack";
}
#top-nav li{
float: left;
position: relative;
list-style: none;
margin: 0 6px 0 0;
text-transform: uppercase;
}

#top-nav li span{
display: block;
padding: 10px;
font-size: 24px;
cursor: pointer;
color: #989698;
}
#top-nav li span:hover{
color: #fff;
background: #e05825;
}
#top-nav li a{
display: block;
padding: 10px;
font-size: 22px;
color: #989698;
}
#top-nav li:hover a{
color: #fff;
font-weight: normal;
}
#top-nav li a:hover{
color: #fff;
background: #4a8bca;
}
#top-nav li a:active{
color: #fff;
background: #4a8bca;
}
#top-nav ul{
list-style:none;
position:absolute;
left:-9999px;
background: #fff;
padding: 0 4px 4px 0;
}
#top-nav ul li{
color: #fff;
float: none;
padding-top: 0px;
}
#top-nav ul li a{
display: block;
 color: #fff;
font-size: 20px;
padding: 5px 20px 8px;
white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}
#top-nav li:hover ul{ /* Display the dropdown on hover */
left:0; /* Bring back on-screen when needed */
}
#top-nav li ul li a:hover{
background:#4a8bca;
color: #fff;
}
#top-nav li:hover a, #top-nav li:hover span { /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
color: #fff;
background:#e05825;
}
#top-nav li:hover ul {
box-shadow: px 1px 1px rgba(132,132,132,0.2);
}

/*main content
----------------------------------------------------------------*/
#grey-pattern-bg{
width: 100%;
height: 375px;
clear: left;
background: transparent url(/themes/site_themes/mcg/images/grey-pattern.jpg);
border-top: 2px solid #e1e2e3;
border-bottom: 2px solid #e1e2e3;
}
#main-hero-section{
position: relative;
margin: 50px 0 0px 0;
font-family: "ostrich_sansblack";
}
 #main-hero-section h2.first-line{
float: left;
font-size: 70px;
text-transform: uppercase;
color: #7d7e7f;
margin: 0 0 10px 0;
}
#main-hero-section h2.second-line{
float: left;
font-size: 115px;
text-transform: uppercase;
color: #4a8bca;
}
#main-hero-section .call-to-action{
float: left;
margin: 28px 0 0 50px;
font-size: 35px;
}
#main-hero-section .call-to-action a{
padding: 9px 15px 7px;
color: #fff;
background: #e05825;
text-transform: uppercase;
font-weight: normal;

}
#main-hero-section .call-to-action a:hover{
background: #4a8bca;
}
#main-hero-section .expertise-list{
clear: left;
float: left;
margin: 40px 0 0 40px;
}
#main-hero-section .expertise-list li{
float: left;
width: 380px;
list-style: none;
color: #7d7e7f;
font-size: 28px;
margin: 0 0 20px 90px;
}
#main-hero-section .expertise-list li a{
color: #7d7e7f;
background: transparent url(/themes/site_themes/mcg/images/grey-arrow.png) no-repeat top right;
padding: 0 15px 0 0
}
#main-hero-section .expertise-list li a:hover{
color: #4a8bca;
}
#blue-bg{
width: 100%;
height: 200px;
clear: left;
background: #c0d7ed url(/themes/site_themes/mcg/images/solutions-bg-v2.png) no-repeat center;
}
.solutions-box{
position: relative;
}
.solutions ul{
padding: 0;
margin: 0;
font-size: 18px;
color: #636363;
text-align: center;
font-family: "robotobold";
height: 220px;
}
.solutions li{
list-style: none;
margin: 0;
padding: 0;
}
.solutions  li a{
text-decoration: underline;
}
.solutions .problem{
width: 450px;
margin: 100px 0 0 0;
padding: 0 20px;
}
.solutions .solution{
width: 450px;
margin: 100px 0 0 0;
padding: 0 20px;
}
.cycle-pager{
z-index: 9999999;
position: absolute;
left: 450px;
top: 180px;
}
.cycle-pager span{
background: #828282;
width: 10px;
height: 10px;
float: left;
text-indent: -99999px;
margin: 0 2px;
cursor: pointer;
}
.cycle-pager span.cycle-pager-active{
background: #4a8bca;
}
#white-bg{
width: 100%;
height: auto;
clear: both;
background: #fff;
}
#cta{
clear: both;
margin: 10px 0 30px 0;
}
#cta-wrapper .call-to-action{
font-family: "ostrich_sansblack";
text-align: center;
font-size: 24px;
}
#cta-wrapper .call-to-action a{
color: #e05825;
background: transparent url(/themes/site_themes/mcg/images/orange-arrow.png) no-repeat top right;
padding: 0 15px 0 0
}
#cta-wrapper .call-to-action a:hover{
color: #828282;
}
/*footer
----------------------------------------------------------------*/
#grey-bg{
width: 100%;
height: 80px;
clear: both;
background: #e1e2e4;
}
#footer{
clear: both;
}
#footer-content{
margin-bottom: 10px;
padding: 20px 0;
}
#footer p{
font-size: 12px;
color: #85898b;
}
#footer a{
font-style: italic;
color: #85898b;
}
#footer p .credit{
float: right;
}

/*interior
----------------------------------------------------------------*/
#page-grey-pattern-bg{
float: left;
width: 100%;
clear: left;
background: transparent url(/themes/site_themes/mcg/images/grey-pattern.jpg);
border-top: 2px solid #e1e2e3;
border-bottom: 2px solid #e1e2e3;
}
#page-header{
padding: 25px 0 20px 0;
margin: 0;
}
.page-header{
font-size: 48px;
color: #7d7e7f;
font-family: "ostrich_sansblack";
}
#main-content{
margin: 30px auto;
}
#main-content .call-to-action{
clear: both;
margin: 40px 0 50px;
font-size: 20px;
font-family: "ostrich_sansblack";
}
#main-content .call-to-action a{
padding: 9px 15px 7px;
color: #fff;
font-weight: bold;
background: #e05825;
text-transform: uppercase;
}
#main-content  .call-to-action a:hover{
background: #4a8bca;
}
#main-content h1{
font-size: 36px;
color: #126092;
font-style: normal;
margin-bottom: 10px;
}
#main-content  p{
font-size: 18px;
margin-bottom: 20px;
line-height: 24px;
}
#main-content  h2, .popup_content h2{
font-family: "ostrich_sansblack";
font-size: 30px;
font-weight: normal;
color: #4a8bca;
margin: 10px 0;
}
#main-content h2.contact-cta{
color: #e05825;
}
#main-content h3, .popup_content h3{
font-family: "ostrich_sansblack";
font-size: 22px;
font-weight: normal;
color: #4a8bca;
margin: 5px 0;
}
#main-content  h4{
font-family: "ostrich_sansblack";
font-size: 16px;
color: #4a8bca;
margin: 5px 0;
}
#main-content  ul, #main-content  ol{
margin: 10px 20px 30px;
}
#main-content  li{
line-height: 24px;
}
.who-we-are{
margin: 20px 0;
-webkit-box-shadow: 1px 1px 1px 0px rgba(50, 50, 50, 0.25);
-moz-box-shadow:   1px 1px 1px 0px rgba(50, 50, 50, 0.25);
box-shadow:  1px 1px 1px 0px rgba(50, 50, 50, 0.25);
}
#main-content  .who-we-are .bio p{
font-size: 16px;
line-height: 20px;
color: #8d8e8e;
padding: 0 20px 0 0;
}
#main-content .right-col h4{
font-size: 24px;
}
.right-col .box{
position:relative;
background: #deeaf5;
padding: 0 0 10px 10px;
margin: 0 0 20px 0;
}
.right-col .box .border{
position: absolute;
left: 0;
bottom: 0px;
width: 10px;
height: 10px;
border-right: 2px solid #fff;
border-top: 2px solid #fff;
}
.right-col .pattern{
padding: 15px 0 15px 15px;
border-left: 2px solid #fff;
border-bottom: 2px solid #fff;
background: #deeaf5 url(/themes/site_themes/mcg/images/blue-pattern.jpg) repeat center;
}
#main-content  .right-col ul, #main-content  .right-col li{
list-style: none;
margin: 0 10px 15px 0;
padding: 0;
font-size: 16px;
line-height: 18px;
}
#main-content .right-col li a{
font-weight: normal;
color: #7d7e7f;
}
#main-content .right-col li a:hover{
color: #e05825;
}
#main-content .testimonials{
margin: 30px 0;
background: #e05825 url(/themes/site_themes/mcg/images/what-our-clients-are-saying.jpg) no-repeat top left;
padding: 50px 0 10px 0;
}
#main-content .testimonials h2{
display: none;
}
#main-content .testimonials p{
color: #fff;
font-size: 20px;
line-height: 26px;
padding: 0 20px;
}


/*Clients-------------------------------------------*/


.individual-client{
position: relative;
background: #deeaf5;
border: 2px solid #edeff2;
width: 231px !important;
margin-bottom: 20px;
}
.individual-client img{
margin-left: 5px;
margin-top: 5px;
}
.individual-client a span{
display: none;
}
.individual-client a:hover span{
display: block;
position: absolute;
top: 0;
left: 0%;
width: 231px;
height: 230px;
background: #deeaf5 url(/themes/site_themes/mcg/images/blue-pattern.jpg) repeat center
}
.individual-client a:hover span .cta-show{
position: absolute;
top: 45%;
left: 15%;
padding: 9px 15px 7px;
color: #fff;
font-weight: bold;
background: #e05825;
text-transform: uppercase;
opacity: 1;
}
.individual-client a:hover span .cta-show:hover{
background: #4a8bca;
}
.popup_content .call-to-action{
width: 320px;
margin: 40px auto 0;
font-size: 20px;
}
.popup_content  .call-to-action a{
padding: 9px 15px 7px;
color: #fff;
font-weight: bold;
background: #e05825;
text-transform: uppercase;
}
.popup_content   .call-to-action a:hover{
background: #4a8bca;
}
.popup_content  .testimonials{
margin: 20px 0;
padding: 10px 0px 15px 0px;
border-top: 3px solid #fff;
border-bottom: 3px solid #fff;
}
.popup_content  .testimonials p{
margin: 10px 0px;
line-height: 28px;
font-family: "robotoitalic", Arial, "Helvetica Neue", Helvetica, sans-serif;
}
/* Overlay style */
.popup_wrapper{
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: rgba(222,234,245,0.9);
z-index: 99999;
padding:  0;
}

/* Overlay closing cross */
.close_button{
width: 80px;
height: 80px;
position: fixed;
right: 20px;
top: 20px;
overflow: hidden;
border: none;
background: url(/themes/site_themes/mcg/images/cross.png) no-repeat center center;
text-indent: 200%;
color: transparent;
outline: none;
}

.popup_wrapper p {
list-style: none;
padding: 0;
margin: 10px auto 0;
width: 1020px;
position: relative;
}

/* Effects */

.popup_wrapper{
visibility: hidden;
opacity: 0;
-webkit-transform: scale(0.9);
transform: scale(0.9);
-webkit-transition: -webkit-transform 0.2s, opacity 0.2s, visibility 0s 0.2s;
transition: transform 0.2s, opacity 0.2s, visibility 0s 0.2s;
}
.popup_visible .popup_wrapper{
visibility: visible;
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);	
-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
transition: transform 0.4s, opacity 0.4s;
}


/* Forms-------------------------------------------- */
#main-content textarea, #main-content input{
height: 20px;
width: 300px;
margin: 10px 0 0 0;
border: none;
outline: none;
padding: 10px;
background: #e1e2e3;
}
#main-content textarea{
resize: none;
width: 385px;
height: 250px;
}
#main-content label{
font-weight: bold;
}
#main-content input[type=submit]{
margin-top: -10px;
cursor: pointer;
float: right;
width: auto;
height: auto;
padding: 9px 15px 7px;
color: #fff;
font-family: "ostrich_sansblack";
background: #e05825;
text-transform: uppercase;
border: none;
font-size: 20px;
}
#main-content input[type=submit]:hover{
background: #4a8bca;
}
/* Tables-------------------------------------------- */

table {
	table-layout: fixed;
	width:90%;
	border-top:1px solid #e5eff8;
	border-right:1px solid #e5eff8;
	margin:1em auto;
		border-collapse:collapse;
	}
caption {
	color: #9ba9b4;
	font-size:.94em;
	letter-spacing:.1em;
	margin:1em 0 0 0;
	padding:0;
	caption-side:top;
	text-align:center;
	}	
tr:first-child	{
	background:#f7fbff
	}
td {
	color:#678197;
	border-bottom:1px solid #e5eff8;
	border-left:1px solid #e5eff8;
	padding:.3em 1em;
	text-align:center;
	}				
th {
	font-weight:normal;
	color: #678197;
	text-align:left;
	border-bottom: 1px solid #e5eff8;
	border-left:1px solid #e5eff8;
	padding:.3em 1em;
	}							
thead th {
	background:#f4f9fe;
	text-align:center;
	font:bold 1.2em/2em "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
	color:#66a3d3
	}	
tfoot th {
	text-align:center;
	background:#f4f9fe;
	}	
tfoot th strong {
	font:bold 1.2em "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
	margin:.5em .5em .5em 0;
	color:#66a3d3;
		}		
tfoot th em {
	color:#f03b58;
	font-weight: bold;
	font-size: 1.1em;
	font-style: normal;
	}