/* =Layout
-------------------------------------------------------------- */
.container {
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
  zoom: 1;
  position: relative;
}

/* Add clearfix styles to the container. read: handy */
.container:before,
.container:after {
  content: '.';
  display: block;
  overflow: hidden;
  visibility: hidden;
  font-size: 0;
  line-height: 0;
  width: 0;
  height: 0;
}

.container:after {
  clear: both;
}

#header-top,
#header,
#navigation,
#highlighted,
#content,
.region-sidebar-first,
.region-sidebar-second,
#footer-top,
#footer-bottom {
  padding-left: 10px;
  padding-right: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  word-wrap: break-word;
  *behavior: url("../boxsizing.htc");
  _display: inline;
  _overflow: hidden;
  _overflow-y: visible;
 }
 
#header-top div.right {
	margin-right: 10px;
}
 
#navigation /* align main menu with logo */ {
	padding-left: 20px;
}

#main-wrapper,
#main,
#content-wrapper,
#sidebar-first,
#sidebar-second {
	position: relative;
}

#main-wrapper {
  z-index: 10;
}

/* Default two column layout */

@media all and (min-width: 480px) {
	.layout-two-col-right #content-wrapper #content #main-content-region, 
	.layout-three-col #content-wrapper #content #main-content-region {
		width: 70%;
		float: left;
	}
	#sidebar-second {
		width: 28%;
		margin: 0 0 1em 2%;
	}
	.theme-utfl.page-node-35 .layout-two-col-right #content-wrapper #content #main-content-region, 
	.theme-utfl.page-node-35 .layout-three-col #content-wrapper #content #main-content-region {
		width: 35%;
	}
	.theme-utfl.page-node-35 #sidebar-second {
		width: 35%;
		padding-top: 50px;
	}
}

@media all and (min-width: 768px) {
	#content-wrapper,
	#sidebar-first,
	#sidebar-second {
		float: left;
	}
	body.one-sidebar #content-wrapper,
	.layout-three-col #content-wrapper{
		width: 75%;
		left: 24%;
	}
	#sidebar-first {
		width: 23%;
		left: -75%;
	}
	body.no-sidebars #content-wrapper {
		width: 100%;
		left: 0;
	}
}

@media screen and (-webkit-min-device-pixel-ratio:0) and (min-width: 768px) {
  #sidebar-first {
    width: 22.7%; /* fix weird Chrome sidebar jag issue */
  }
}

/* Header blocks */

@media all and (max-width: 568px) {
	a#logo {
		margin-bottom: 10px;
	}
	#header-right-wrapper {
	float: left;
	}
	#header-wrapper #block-search-form,
	#header .menu-name-menu-header-mini-menu ul {
		float: none;
	}
	ul#secondary-menu a, #header .menu-name-menu-header-mini-menu ul a {
		margin-left: 0;
	}
}

/* Footer blocks */

@media all and (max-width: 686px) {
	ul#social-media {
		margin-bottom: 1em;
	}
	#footer-top ul.menu {
		float: left;
	}
/* 	#footer-top ul.menu li.first a,
	#footer-bottom ul.menu li.first a {
		padding-left: 0;
		margin-left: 0;
	} */
	#footer-bottom ul.menu {
		float: none;
		text-align: left;
	}
	#footer-bottom {
		text-align: left;
	}
}


/* Career development office contact page: http://stage.utfl.civicrm.ca/student-life/career-development-office/cdo-who-we-are */

.two-columns .column{
  float: left;  
  width: 48%;
}

.two-columns .left-column{
  margin-right: 2%;
}

.two-columns .right-column{
  margin-left: 2%;
}

/* .two-columns, .three-columns{
  width: 70%;
}

.layout-three-col .two-columns,
.layout-two-col-right .two-columns,
.layout-three-col .three-columns,
.layout-two-col-right .three-columns{
  width: 50%;
}

.layout-three-col .two-columns .column,
.layout-two-col-right .two-columns .column{
  width: 24%;
}

.three-columns .column{
  float: left;
  width: 24%;
}

.three-columns .middle-column{
  margin-left: 3%;
  margin-right: 3%;
}

.layout-three-col .three-columns .column,
.layout-two-col-right .three-columns .column{
  width: 15%;
} */

/* Adjust structural elements for iframe pages */
.page-iframe .layout-one-col {
  background: none;
}

.page-iframe .layout-one-col #content-wrapper {
  width: 96%;
  margin-left: 2%;
  margin-right: 2%;
  left: 0;
}
