*,
*:after,
*::before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
'


@font-face {
    font-family: myparafont;
    src: url(../font/KaushanScript-Regular.otf);

}


@font-face {
    font-family: myheadingfont;
    src: url(../font/gothic_ultra_ot.otf);

}



@font-face {
    font-family: myfooterfont;
    src: url(../font/ONRAMP.otf);

}

@font-face {
    font-family: myinnerpage;
    src: url(../font/MontereyFLF-Italic.ttf);

}

@font-face {
    font-family:subheading;
    src: url(../font/Hydrophilia_Liquid.otf);

}

@font-face {
    font-family:para;
    src: url(../font/QueenofCamelotItalic.ttf);

}

*{
margin:0px;
padding:0px;

}
/* General styles and layout */

body {
	background: #3498db;
	color: #fff;
	font-size:18px;
	font-family:para;
	
	
}

.container {
	overflow: hidden;
	/* we don't want the pseudo-elements sticking out */
}

.container svg {
	display: block;
}




.subhead{
height:50px;
margin-top:-70px;

}


.logo{
margin-top:10px;
width:100px;
height:120px;
margin-left:50px;
float:left;

}



.topnav{
width:700px;
float:right;
text-align:center;
}

.topnav li{
float:left;
list-style:none;
height:35px;
width:100px;
font-size:16px;
margin:10px;
}

.topnav a{
height:40px;
line-height:25px;
display:block;
text-decoration:none;
color:#fff;
font-size:17px;

font-family:myinnerpage;

}


.topnav a:active{
background-color:#5a5663;
}


.topnav a:hover{
background-color:#0d0d0e;
border-style:solid;
border-color:#122280;
box-shadow: 5px 5px gray;
font-weight:bold;
color:#fff;


}


button{
width:100px;
height:50px;
background-color:#009900;



}


section {
	position: relative;
	padding: 10em 10%;
	background: #88a666;
	color: #fff;
	text-align: center;
}

section h2 {
	margin: 0;
	padding: 0;
	font-size:60px;
	font-weight:bold;
	letter-spacing:.5px;
	font-family:myheadingfont;
	
}

section h1 {
	margin: 0;
	padding: 0;
	font-size:23px;
	font-weight:bold;
	letter-spacing:3px;
	font-family:subheading;
}



section p {
	color: rgba(0,0,0,.6);
	font-size: 1.3em;
	line-height: 1.5;
	font-family:myparafont;
}

section a {
text-decoration:none;
padding:0px;
margin:0px;


	}




.text:first-child {
	text-align: right;
}

.text:nth-child(2) {
	text-align: left;
}

.col-2 .column {
	width: 49%;
}

.col-3 .column {
	padding: 0 1%;
	width: 33%;
	text-align: center;
}

.col-3 .column p {
	padding: 1.4em;
}

.column {
	display: inline-block;
	vertical-align: top;
}

.icon {
	display: block;
	width: 2em;
	height: 2em;
	border-radius: 50%;
	background: rgba(0,0,0,0.1);
	color: #fff;
	text-align: center;
	font-size: 8em;
	line-height: 2em;
	margin: 0 auto;
}

section.color h2 {
	color: #fff;
}

.color {
	background: #3498db;
}

#kits{background-color:#88a666;height:470px;}
#services{
	background-color:#1088ab;
    height:510px;
	margin-top:0px;}

#association{background-color:#f06374;height:600px;}
#sliding{height:400px;}
#gal-01{height:470px;margin-left:-60px;}
.center{text-align:center;}
.boxed{max-width:400px; margin-left:50px;}
div.inline { float:left; }

.video{margin-left:230px;}

#myDIV {
    width: 100%;
    padding: 50px 0;
    text-align: center;
    background-color: lightblue;
    margin-top:20px;
}

#main{margin-top:-170px;margin-left:-135px;height:410px;}

/*** Individual section styles and separators ***/

/* Common style for pseudo-elements */
section::before,
section::after {
	position: absolute;
	content: '';
	pointer-events: none;
}

/* Triangles */

.ss-style-triangles::after {
	left: 50%;
	width: 50px;
	height: 50px;
	-webkit-transform: translateX(-90%) rotate(45deg);
	transform: translateX(-90%) rotate(45deg);
}

.ss-style-triangles::before {
	top: -40px;
	background-image:url(../images/back.png);
}

.ss-style-triangles::after {
	bottom: -59px;
	z-index: 10;
	margin-left: 20px;
	background-color:#88a666;
}

/* Double Diagonal line */

.ss-style-doublediagonal {
	z-index: 1;
	padding-top: 6em;
	background: #2072a7;
}

.ss-style-doublediagonal::before,
.ss-style-doublediagonal::after {
	top: 0;
	left: -25%;
	z-index: -1;
	width: 150%;
	height: 75%;
	background: inherit;
	-webkit-transform: rotate(-2deg);
	transform: rotate(-2deg);
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
}

.ss-style-doublediagonal::before {
	height: 50%;
	background: #116094;
	-webkit-transform: rotate(-3deg);
	transform: rotate(-3deg);
	-webkit-transform-origin: 3% 0;
	transform-origin: 3% 0;
}

/* Half Circle */
.ss-style-halfcircle::before,
.ss-style-halfcircle::after {
	left: 50%;
	z-index: 10;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	background: inherit;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}

.ss-style-halfcircle::before {
	top: -50px;
}

.ss-style-halfcircle::after {
	bottom: -50px;
}

/* Big Triangle */
svg#bigTriangleColor {
	pointer-events: none;
}

#bigTriangleColor path {
	fill: #3498db;
	stroke: #3498db;
	stroke-width: 2;
}

/* Curves */
#curveUpColor path,
#curveDownColor path {
	fill: #3498db;
	stroke: #3498db;
}

/* Multiple Triangles */
.ss-style-multitriangles::before,
.ss-style-multitriangles::after {
	left: 50%;
	width: 50px;
	height: 50px;
	-webkit-transform: translateX(-50%) rotate(45deg);
	transform: translateX(-50%) rotate(45deg);
}

.ss-style-multitriangles::before {
	top: -25px;
	background: inherit;
	box-shadow: -50px 50px 0 #3498db, 50px -50px 0 #3498db;
}

.ss-style-multitriangles::after {
	bottom: -25px;
	z-index: 10;
	background: inherit;
	box-shadow: -50px 50px 0 #3498db, 50px -50px 0 #3498db;
}

/* Rounded corners */
.ss-style-roundedcorners::before {
	top: 100%;
	left: 0;
	z-index: 10;
	width: 100%;
	height: 60px;
	border-radius: 0 0 60px 60px;
	background: inherit;
}

/* Rounded center split and bottom rounded */
.ss-style-roundedsplit {
	padding-top: 7em;
	border-radius: 0 0 80px 80px;
}

.ss-style-roundedsplit::before,
.ss-style-roundedsplit::after {
	top: -70px;
	left: 0;
	z-index: 10;
	width: 50%;
	height: 70px;
	background: inherit;
}

.ss-style-roundedsplit::before {
	border-radius: 0 80px 0 0;
}

.ss-style-roundedsplit::after {
	left: 50%;
	border-radius: 80px 0 0 0;
}

/* Inverted rounded corners */
.ss-style-invertedrounded {
	margin-bottom: 90px;
	padding: 13em 10% 10em;
	border-radius: 0 0 0 90px;
}

.ss-style-invertedrounded::before,
.ss-style-invertedrounded::after {
	left: 0;
	z-index: -1;
	height: 90px;
	background: #3498db;
}

.ss-style-invertedrounded::before {
	top: 100%;
	width: 100%;
	border-radius: 0 90px 0 0;
} 

.ss-style-invertedrounded::after {
	bottom: 0;
	z-index: -1;
	width: 50%;
}

/* Boxes */
.ss-style-boxes {
	padding-top: 4em;
	padding-bottom: 13em;
}

.ss-style-boxes::before {
	bottom: 0;
	left: 0;
	width: 100%;
	height: 50px;
	background-image: -webkit-gradient(linear, 100% 0, 0 100%, color-stop(0.5, #3498db), color-stop(0.5, #88a666));
	background-image: linear-gradient(to right, #3498db 50%, #88a666 50%);
	-webkit-background-size: 130px 100%;
	background-size: 130px 100%;
}

/* Zig Zag (3d up and simple down) */
.ss-style-zigzag::before,
.ss-style-zigzag::after {
    right: 0;
    left: 0;
    z-index: 10;
    display: block;
    height: 90px;
    background-size: 50px 100%;
  }

.ss-style-zigzag::before {
	top: -90px;
	background-image: -webkit-gradient(linear, 0 0, 300% 100%, color-stop(0.25, transparent), color-stop(0.25, #3498db));
	background-image:
		linear-gradient(315deg, #3093d5 25%, transparent 25%),
		linear-gradient( 45deg, #3498db 25%, transparent 25%);
	background-position: 50%;
}

.ss-style-zigzag::after {
	top: 100%;
	background-image: -webkit-gradient(linear, 0 0, 300% 100%, color-stop(0.25, #3498db), color-stop(0.25, #88a666));
	background-image: 
		linear-gradient(135deg, #3498db 25%, transparent 25%),
		linear-gradient(225deg, #3498db 25%, transparent 25%);
	background-position: 50%;
}

/* Edges */
.ss-style-roundedges {
	padding-bottom: 16em;
}

.ss-style-roundedges::before,
.ss-style-roundedges::after {
	width: 200px;
	height: 200px;
	border-radius: 50%;
	background: #88a666;
	top: -100px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.ss-style-roundedges::before {
	left: -100px;
}

.ss-style-roundedges::after {
	right: -100px;
}

/* Slit */
.ss-style-slit {
	padding-top: 5em;
}

.ss-style-slit::before, 
.ss-style-slit::after {
	width: 50.5%;
	width: -webkit-calc(50% + 10px);
	width: -moz-calc(50% + 10px);
	width: calc(50% + 10px);
	height: 160px;
	background: #88a666;
	top: -160px;
}

.ss-style-slit::before {
	left: -20px;
	-webkit-transform: skewX(10deg);
	transform: skewX(10deg);
	box-shadow: -10px -20px #3192d3;
}

.ss-style-slit::after {
	right: -20px;
	-webkit-transform: skewX(-10deg);
	transform: skewX(-10deg);
	box-shadow: 10px -20px #3192d3;
}

/* Big half circle */
#bigHalfCircle path {
	fill: #3498db;
	stroke: #3498db;
}

/* Big triangle with shadow */

#trianglePath1 {
	fill: #3498db;
	stroke: #3498db;
} 

#trianglePath2 {
	fill: #2072a7;
	stroke: #2072a7;
}

/* Inclined Zig Zag */
.ss-style-inczigzag::before,
.ss-style-inczigzag::after {
	left: 0;
	width: 100%;
	height: 50px;
	background-size: 100px 100%;
}

.ss-style-inczigzag::before {
	top: 0;
	background-image: -webkit-gradient(linear, 0 0, 10% 100%, color-stop(0.5, #88a666), color-stop(0.5, #3498db));
	background-image: linear-gradient(15deg, #3498db 50%, #88a666 50%);
}

.ss-style-inczigzag::after {
	bottom: 0;
	background-image: -webkit-gradient(linear, 0 0, 10% 100%, color-stop(0.5, #3498db), color-stop(0.5, #88a666));
	background-image: linear-gradient(15deg, #88a666 50%, #3498db 50%);
}

/* Castle */
.ss-style-castle::before {
	left: 0;
	width: 100%;
	height: 50px;
	background-size: 200px 100%;
	top: 0;
	background-image: -webkit-linear-gradient(40deg, #3498db 50%, #1088ab 50%);
	background-image: linear-gradient(40deg, #3498db 50%, #1088ab 50%);
}

/* Alternative slit with inner shadow */
#slitPath1 {
	fill: #3498db;
	stroke: red;
	stroke-width: 0;
}

#slitPath2, #slitPath3 {
	fill: #2072a7;
}

/* Folded corner */
.ss-style-foldedcorner::before,
.ss-style-foldedcorner::after {
	bottom: 0;
	width: 100px;
	height: 100px;
}

.ss-style-foldedcorner::before {
	right: 0;
	background-image: -webkit-linear-gradient(top left, #37a2ea 50%, #3498db 50%);
	background-image: linear-gradient(315deg, #3498db 50%, #37a2ea 50%);
}

.ss-style-foldedcorner::after {
	right: 100px;
	background-image: -webkit-linear-gradient(top left, transparent 50%, #236fa1 50%);
	background-image: linear-gradient(315deg, #236fa1 50%, transparent 50%);
}

/* Dots */
.ss-style-dots::before {
	bottom: 20px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	background: #2072a7;
	box-shadow: 30px 0 #2072a7, -30px 0 #2072a7;
}

/* Double Line */
.ss-style-doubleline::before {
	bottom: 30px;
	width: 140px;
	height: 2px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	background: #2072a7;
	box-shadow: 0 30px 0 #2072a7;
}

/* Cross */
.ss-style-cross {
	padding-bottom: 15em;
}

.ss-style-cross::before,
.ss-style-cross::after {
	background: #2072a7;
	bottom: 70px;
	width: 200px;
	height: 2px;
	left: 50%;
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
}

.ss-style-cross::before {
	-webkit-transform: translateX(-50%) rotate(45deg);
	transform: translateX(-50%) rotate(45deg);
}

.ss-style-cross::after {
	-webkit-transform: translateX(-50%) rotate(-45deg);
	transform: translateX(-50%) rotate(-45deg);
}

/* Stamp */
#stamp path {
	fill: #3498db;
	stroke: #3498db; /* avoid gap in FF */
}

/* Clouds */
#clouds path {
	fill: #ecf0f1;
	stroke: #ecf0f1;
}


li a, .dropbtn {
    display: inline-block;
    color: white;
    text-align: center;
    text-decoration: none;
}

li a:hover, .dropdown:hover .dropbtn {
background-color:#0d0d0e;
border-style:solid;
border-color:#122280;
box-shadow: 5px 5px gray;
font-weight:bold;
color:#fff;
}

li.dropdown {
    display: inline-block;
	
}

.dropdown-content {
    display: none;
    position: absolute;
	z-index:1000;
	background-color:#fff;
	box-shadow: 5px 5px gray;

	width:310px;
line-height:25px;


}

.dropdown-content a {
    color: black;
   text-decoration: none;
    display: block;
    text-align: left;
	padding-left:3px;
}

.dropdown-content a:hover {background-color: #3498db}

.dropdown:hover .dropdown-content {
    display: block;
}

.jspContainer
{
	overflow: hidden;
	position: relative;
}

.jspPane
{
	position: absolute;
}

.jspVerticalBar
{
	position: absolute;
	top: 0;
	right: 0;
	width: 16px;
	height: 100%;
	background: red;
}

.jspHorizontalBar
{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 16px;
	background: red;
}

.jspVerticalBar *,
.jspHorizontalBar *
{
	margin: 0;
	padding: 0;
}

.jspCap
{
	display: none;
}

.jspHorizontalBar .jspCap
{
	float: left;
}

.jspTrack
{
	background: #F2F4F8;
	position: relative;
}

.jspDrag
{
	background: #79a1b5;
	position: relative;
	top: 0;
	left: 0;
	cursor: pointer;
	border:1px solid #56839a;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag
{
	float: left;
	height: 100%;
}

.jspArrow
{
	background: #50506d;
	text-indent: -20000px;
	display: block;
	cursor: pointer;
}

.jspArrow.jspDisabled
{
	cursor: default;
	background: #80808d;
}

.jspVerticalBar .jspArrow
{
	height: 16px;
}

.jspHorizontalBar .jspArrow
{
	width: 16px;
	float: left;
	height: 100%;
}

.jspVerticalBar .jspArrow:focus
{
	outline: none;
}

.jspCorner
{
	background: #eeeef4;
	float: left;
	height: 100%;
}

/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner
{
	margin: 0 -3px 0 0;
}


.jp-container{
padding:10px;
width:1024px;
  margin-left:-100px;
    height:480px;
    position:relative;
    
   
	float:left;
}


.jp-container a:first-child{
    border-top:none;
}
.jp-container a:last-child{
    border-bottom:none;
}
.jp-container a:hover{

   
}
.jp-container a h3{ 
    font-size:14px;
    font-weight:bold;
    padding:2px 0 5px 0;
	text-transform:uppercase;
}
.jp-container a img{
    float:left;
    margin:5px 10px 0px 0px;
    padding:3px;
   
    
}

.footer{
 font-family: myfooterfont;
}


/* Mediaqueries */

  /*Mobile Phones*/

/*Mediaquery 320px*/

@media (min-width: 320px) and (max-width: 359px){
	
.logo{
margin-top:0px;
width:10px;
height:80px;
margin-left:-7px;
float:left;
}

.fluid {
    float: left;
    width: 450px;
    padding:0px; 
	margin-top:40px;
    }
	
#kits {height:670px;}
#math-a-magic {
    padding:0px; 
	width:250px;}
	
#services{
	background-color:#1088ab;
    height:1000px;
	margin-top:0px;}
	
#association{background-color:#f06374;height:390px;}

#associated{
    width: 310px;
    padding:0px; 
	height:120px;
	margin-left:120px;
	margin-top:20px;
    }
#gal-01{height:470px;margin-left:-157px;}

#sliding{height:1px;}
#main{margin-top:-170px;margin-left:-50px;height:810px;}

.center{text-align:center;}
.boxed{margin-left:10px;}

.video{margin-left:-30px;}
.ss-style-triangles::after {
	bottom: 0px;
	top:160px;
	z-index: 10;
	margin-left: 20px;
	background-color:#88a666;
}

}
	
@media (min-width: 320px) and (max-width: 359px) and (orientation:landscape) {
	
.logo{
margin-top:0px;
width:10px;
height:80px;
margin-left:-7px;
float:left;
}


.topnav{
width:100px;
float:none;
text-align:center;
}

.topnav li{
float:left;
list-style:none;
height:35px;
font-size:1em;
margin:0;
}

.topnav a{
height:40px;
line-height:25px;
display:block;
text-decoration:none;
color:#fff;
font-size:17px;

font-family:myinnerpage;

}


.topnav a:active{
background-color:#5a5663;
}


.topnav a:hover{
background-color:#0d0d0e;
border-style:solid;
border-color:#122280;
box-shadow: 5px 5px gray;
font-weight:bold;
color:#fff;


}

.fluid {
    float: left;
    width: 450px;
    padding:0px; 
	margin-top:40px;
    }
	
#kits {height:670px;}
#math-a-magic {
    padding:0px; 
	width:250px;}
	
#services{
	background-color:#1088ab;
    height:1000px;
	margin-top:0px;}
	
#association{background-color:#f06374;height:390px;}

#associated{
    width: 510px;
    padding:0px; 
	height:610px;
	margin-left:720px;
	margin-top:20px;
    }
#gal-01{height:470px;margin-left:-157px;}

#sliding{height:1px;}
.aslide img {
                width:2000px; 
				max-height:100%;               
            }
#main{margin-top:-170px;margin-left:-50px;height:810px; }
.center{text-align:center;}
.boxed{margin-left:10px;}

.video{margin-left:-30px;}
.ss-style-triangles::after {
	bottom: -59px;
	z-index: 10;
	margin-left: 20px;
	background-color:#88a666;
}
	
}
	
/*Mediaquery 360px*/

@media (min-width: 360px) and (max-width: 480px){
	
.logo{
margin-top:0px;
width:10px;
height:80px;
margin-left:-7px;
float:left;
}


.topnav{

float:none;
text-align:center;
}

.topnav li{
float:left;
list-style:none;
margin-left:-35px;
font-size:1em;
margin-top:60px;
}

.topnav a{
height:40px;
line-height:25px;
display:block;
text-decoration:none;
color:#fff;
font-size:17px;

font-family:myinnerpage;

}


.topnav a:active{
background-color:#5a5663;
}


.topnav a:hover{
background-color:#0d0d0e;
border-style:solid;
border-color:#122280;
box-shadow: 5px 5px gray;
font-weight:bold;
color:#fff;


}


.fluid {
    float: left;
    width: 450px;
    padding:0px; 
	margin-top:40px;
    }
	
#kits {height:670px;}
#math-a-magic {
    padding:0px; 
	width:250px;}
	
#services{
	background-color:#1088ab;
    height:1000px;
	margin-top:0px;}
	
#association{background-color:#f06374;height:390px;}

#associated{
    width: 310px;
    padding:0px; 
	height:120px;
	margin-left:120px;
	margin-top:20px;
    }
#gal-01{height:470px;margin-left:-157px;}

#sliding{height:1px;}


.center{text-align:center;}
.boxed{margin-left:10px;}

.video{margin-left:-30px;}
#main{margin-top:-170px;margin-left:-50px;height:810px; max-width:10px;}
.ss-style-triangles::after {
	bottom: 0px;
	top:160px;
	z-index: 10;
	margin-left: 20px;
	background-color:#88a666;

}
}
	
   /*Phablets*/
	
 /*Mediaquery 800px*/ 

@media (min-width: 481px) and (max-width:800px) { 
	
.logo{
margin-top:0px;
width:10px;
height:80px;
margin-left:-7px;
float:left;
}

.fluid {
    float: left;
    width: 450px;
    padding:0px; 
	margin-top:40px;
    }
	
#kits {height:670px;}
#math-a-magic {
    padding:0px; 
	width:250px;}
	
#services{
	background-color:#1088ab;
    height:1000px;
	margin-top:0px;}
	
#association{background-color:#f06374;height:390px;}

#associated{
    width: 510px;
    padding:0px; 
	height:160px;
	margin-left:120px;
	margin-top:20px;
    }
#gal-01{height:470px;margin-left:-157px;}

#sliding{height:0px; margin-top:55px; margin-left:-20px;}
.aslide img {
                width:700px; 
				height:300px; 
margin-left:-5px;				
            }

.center{text-align:center;}
.boxed{margin-left:10px;}

.video{margin-left:40px;}
#main{margin-top:-190px;margin-left:-50px;height:810px;}
.ss-style-triangles::after {
	bottom: 0;
	top:160px;
	z-index: 10;
	margin-left: 20px;
	background-color:#88a666;
}
}

  /*Tablets*/
  
 /*Mediaquery 1024px*/ 
 
 @media (min-width: 801px) and (max-width: 1024px){
	
.logo{
margin-top:0px;
width:10px;
height:80px;
margin-left:-7px;
float:left;
}

.fluid {
    float: left;
    width: 450px;
    padding:0px; 
	margin-top:40px;
    }
	
#kits {height:670px;}
#math-a-magic {
    padding:0px; 
	width:250px;}
	
#services{
	background-color:#1088ab;
    height:1000px;
	margin-top:0px;}
	
#association{background-color:#f06374;height:390px;}

#associated{
    width: 510px;
    padding:0px; 
	height:160px;
	margin-left:120px;
	margin-top:20px;
    }
#gal-01{height:470px;margin-left:-157px;}

#sliding{height:1px;}
.aslide img {
                max-width:2000px; 
				max-height:100%;               
            }

.center{text-align:center;}
.boxed{margin-left:10px;}

.video{margin-left:40px;}


 } 

 /*Mediaquery 1280px*/ 
 
@media (min-width: 1025px) and (max-width: 1280px){ 
	
.logo{
margin-top:0px;
width:10px;
height:80px;
margin-left:-7px;
float:left;
}

.fluid {
    float: left;
    width: 450px;
    padding:0px; 
	margin-top:40px;
    }
	
#kits {height:670px;}
#math-a-magic {
    padding:0px; 
	width:250px;}
	
#services{
	background-color:#1088ab;
    height:1000px;
	margin-top:0px;}
	
#association{background-color:#f06374;height:390px;}

#associated{
    width: 310px;
    padding:0px; 
	height:120px;
	margin-left:120px;
	margin-top:20px;
    }
#gal-01{height:470px;margin-left:-157px;}

#sliding{height:1px;}


.center{text-align:center;}
.boxed{margin-left:10px;}

.video{margin-left:-30px;}
#main{margin-top:-170px;margin-left:-130px;height:810px; max-width:10px;}

 } 
 
 
/* Media Queries for the layout */
@media screen and (max-width: 68em) {
	section {
		font-size: 80%;
	}
}

@media screen and (max-width: 54em) {
	.style {
    height: 150px;
}
	.column {
		display: block;
		width: 100% !important;
	}

	.text:first-child,
	.text:nth-child(2) {
		text-align: center;
	}

	.icon {
		margin: 0 auto;
	}

	.col-2 .column:first-child .icon {
		margin: 0 auto 50px;
	}

	.col-2 .column:nth-child(2) .icon {
		margin: 50px auto 0;
	}
}