/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
*,*:before,*:after{-ms-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}html{-ms-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:sans-serif;font-size:100%;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;line-height:1.5}body,table,tbody,thead,tr,th,td,iframe,div,section,article,aside,header,footer,main,menu,nav,h1,h2,h3,h4,h5,h6,hr,form,fieldset,legend,button,input,select,optgroup,option,textarea,ul,ol,li,dl,dt,dd,blockquote,p,details,summary,pre,figure,img,audio,canvas,video,object,embed,span,a,strong,b,em,i,u,s,cite,abbr,sub,sup,mark,del,ins,code,kbd,samp,var{vertical-align:top;margin:0;border:0;padding:0;font-family:inherit;font-size:1em;line-height:inherit;text-transform:none;color:inherit;background:none;overflow:visible;outline:none}iframe,div,section,article,aside,header,footer,main,menu,nav,h1,h2,h3,h4,h5,h6,hr,form,fieldset,legend,ul,ol,dl,dt,dd,blockquote,p,details,summary,pre,figure,figcaption{display:block}img,audio,canvas,video,object,embed{display:inline-block}audio:not([controls]){display:none;height:0}svg:not(:root){overflow:hidden}[hidden],template{display:none}textarea{overflow:auto;resize:vertical}button,input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],input[disabled]{cursor:default}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}a:focus{outline:dotted thin}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}

/*--------------------------------------------------------------
# Standard Tags
--------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Lato:400,400i,700|Ubuntu:500');

html{font-size:125%;-webkit-overflow-scrolling:touch}
body{position:relative;font-size:1em;line-height:1.5;background:#f5f5f5}

iframe,img,audio,canvas,video,object,embed{vertical-align:middle;max-width:100%}
img{height:auto}

iframe{margin:0 auto 1.5em auto}

h1,h2,h3,h4,h5,h6{margin:1em 0 0.5em 0;line-height:normal;font-weight:700}
h1{font-size:2em}
h2{font-size:1.75em}
h3{font-size:1.5em}
h4{font-size:1.25em}
h5{font-size:1em}
h6{font-size:0.75em}

p{margin:0 0 1em 0}
ul,ol{margin:0 0 1.5em 2.5em}
li>ul,li>ol{margin:0 0 0 1.5em}
li{margin:0 0 0.5em 0}

table{margin:0 0 1.5em 0;border-collapse:separate;border-spacing:0;width:100%}
th{font-weight:bold}

a{text-decoration:none;-webkit-transition:all 300ms ease;transition:all 300ms ease}

strong,b{font-weight:700}

/*--------------------------------------------------------------
# Custom Elements
--------------------------------------------------------------*/
.clear,.contain{/* zoom:1 */}
.clear:after,.contain:after{content:'';display:block;visibility:hidden;clear:both;height:0}

.contain{display:block;position:relative;margin:auto;padding:0 1.5rem;width:100%}

.grid{display:-ms-grid;display:grid;grid-auto-flow:row dense;-ms-grid-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;grid-template-columns:repeat(12,1fr);-ms-grid-rows:auto;grid-template-rows:auto;position:relative;padding:0 1.5rem}
.grid>*{-ms-grid-column-span:12;grid-column:span 12}

.button{display:inline-block;vertical-align:middle;border-radius:0.25em;padding:0.5em 1em;font-size:1em;font-weight:bold;line-height:normal;text-align:center;text-decoration:none;cursor:pointer;-webkit-transition:all 300ms;transition:all 300ms}
.button:hover,.button:active,.button:focus{text-decoration:none;outline:none}

/*--------------------------------------------------------------
# Site Structure
--------------------------------------------------------------*/
#wrapper{margin:auto;max-width:96rem;overflow:hidden;}
#wrapper,#wrapper>*{width:100%}


/*--------------------------------------------------------------
# Customization
--------------------------------------------------------------*/
body { font-family: 'Lato', sans-serif; color: #4a4a4a; }

h1,h2,h3,h4 { font-family: 'Ubuntu', sans-serif; font-weight: 500; }
h1 { margin: 0; }

a{ color: #278acb; }
a:hover { color: #76c26a; }

.button{ border-radius: 0.1em; padding: 0.5em 2em; font-family: 'Ubuntu', sans-serif; font-weight: 500; color: #fff; background: #996cae; box-shadow: 0.1em 0.1em 0.1em 0 rgba(0,0,0,0.5); }
.button:hover,.button:active,.button:focus{ color: #5abfbc; background: #fff; }

#header { padding-top: 2rem; padding-top: 2rem; }

#main { padding-top: 3rem; padding-bottom: 3rem; }

#footer { padding-top: 2rem; padding-bottom: 2rem; font-size: 1.2em; }

/*--------------------------------------------------------------
# Responsive
--------------------------------------------------------------*/
@media only screen and (min-width:38.5em){ /*616px*/
	.grid, .contain { padding-left: 3rem; padding-right: 3rem; }
}

@media only screen and (min-width:82.5em){
	.grid, .contain { padding-left: calc(50% - 30rem); padding-right: calc(50% - 30rem); }
}

/*--------------------------------------------------------------
# Custom Styles for Specific Trainging
--------------------------------------------------------------*/

.flex { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: flex-start; align-content: flex-start; }
.item { flex: 1 0 auto; position: relative; height: 6em; line-height: 1; text-align: center; color: #fff; background-color: #777; }
.item-num { display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 1em; height: 1em; font-size: 3em; }

.item-1 { background: #76c26a; }
.item-2 { background: #5abfbc; }
.item-3 { background: #63c0ec; }
.item-4 { background: #278acb; }
.item-5 { background: #7968b0; }
.item-6 { background: #996cae; }
.item-7 { background: #ce5b90; }
.item-8 { background: #ef6a99; }
.item-9 { background: #e95f45; }