html, body, p, td, select, input {
	font-size: 100%; 
	font-family: Roboto,sans-serif;	
	font-weight:normal;
	margin: 0;
	/* Segoe UI  freight-sans-pro Roboto,sans-serif*/
}
		
ul {
	margin:0px 0px 0px 20px;
	padding:0px;
	}

.input1 {background-color:#FFFFFF; border:1px solid #CCCCCC; cursor: hand;}
.inputbutton {color:#000000;background-color:#FF9933;border:1px solid #000000;cursor: hand;}
.inputbutton3 {border:1px solid #330000;background-color:#FF9933;color:#330000;cursor: hand;}

.headingpage {
	color: #828181;
	padding-left: 10px;
	}
	
.facile {color:#000000;}	
.facile A:link {text-decoration: none; color : #ff8000;}
.facile A:visited {text-decoration: none; color : #ff8000;}
.facile A:active {text-decoration: none;color: #ff8000;}
.facile A:hover {text-decoration: none;color: #ff8000;}
.facile td {color:#000000;font-weight:normal;}
.facile table {color:#000000;}

.clear{clear: both;}

.brownfont{color: #330000;}

.brownbar{
	padding: 8px; 
	background-color: #330000;
	vertical-align: middle;
	}
	
.vertical100{	
	min-height: 100vh;
	/*
	min-height: calc(100vh - 55px);
	min-height: 96vh;
	*/
}

.verticalbottom{
}


		
.topmenu{padding: 7px; background-color: #330000;}
.topmenu A:link {text-decoration: none; color: #FFFFFF;}
.topmenu A:visited {text-decoration: none; color: #FFFFFF;}
.topmenu A:active {text-decoration: none;color: #FF9933;}
.topmenu A:hover {text-decoration: none;color: #FF9933;}
	
.brownblock {
	display: block;
	background-color: #330000;
	}

.previewStudents td{
	color:#000000;
	}
 
.preview-title{
	text-align:left;
	font-weight:bold;
	color:#000000;
	padding-left:5px;
	}

.submitLink{
	background-color:Transparent;
	color:#ff8000;
	cursor: pointer;
	border:0;
	text-decoration: none;
	} 

div.polaroid {
  box-shadow: 0 4px 30px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
  text-align: left;
}

div.container {
  padding: 10px 15px;
}

.inputbuttonN {
  display: inline-block;
  padding: 5px 15px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  color: #fff;
  background-color: #FF8000;
  border: none;
  border-radius: 15px;
  box-shadow: 0 2px #999;
}

.inputbuttonN:hover {
	background-color:  #FF9933
	}

.inputbuttonN:active {
  background-color: #e67300;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}

.smallgrayfont{
	font-size:x-small;
	color:#666666;	
}

.divpaddingmargin1{
	padding:5px 10px;
	border:solid 1px;
	margin:10px 40px;
}

.formpadding{
	padding:5px 10px;
	margin:10px 30px;	
}

.border1 {
border-bottom:1px solid black;
border-right:1px solid black;	
}

.border2 {
border-bottom:1px solid black;
border-right:0px solid black;	
}

.border3 {
border-bottom:none;
border-right:none;
}

.paddingrightpercent {padding-right:2%;}

.border1{border:1px solid black;}

.borderbottom{border-bottom:1px solid black;}

.padding5 {padding:5px;}
.padding10 {padding:10px;}
.padding20 {padding:20px;}

.padding5top {padding-top:5px;}
.padding6top {padding-top:6px;}
.padding8top {padding-top:8px;}
.padding15top {padding-top:15px;}
.padding16top {padding-top:16px;}
.padding20top {padding-top:20px;}
.padding40top {padding-top:40px;}

.paddingright7 {padding-right:7px;}
.paddingright10 {padding-right:10px;}
.paddingright15 {padding-right:15px;}
.paddingright20 {padding-right:20px;}
.paddingright25 {padding-right:25px;}

.paddingleft10 {padding-left:10px;}
.paddingleft15 {padding-left:15px;}
.paddingleft20 {padding-left:20px;}
.paddingleft25 {padding-left:25px;}

.padding5bottom {padding-bottom:5px;}
.padding10bottom {padding-bottom:10px;}
.padding16bottom {padding-bottom:16px;}
.paddingbottom20 {padding-bottom:20px;}

.top{vertical-align: top;}
.displayinline{display: inline;}
.graybackground{background: #808080;}
.width100{width:100%;}
.textcenter{text-align:center;}
.width70 {width:70%;}
.floattoright{float:right;}

.tableborder1 {
	border:1px solid black;
	margin-top:10px; 
	border-collapse: collapse;}
.tableborder1  td {padding: 5px;;}

.tableborder2{
	border:1px solid black;
	margin-top:10px;
	margin-left:5px;
	border-collapse: collapse;}
.tableborder2  td {padding: 5px;}

.tableborder3{
	border:1px solid black;
	margin-top:10px;
	margin-left:20px;
	border-collapse: collapse;}
.tableborder3  td {padding: 10px;}

.tableborder4{
	border:1px solid black;
	margin-top:10px;
	border-collapse: collapse;}
.tableborder4  td {padding: 5px;}

.tableborder5{
	border:1px solid black;
	border-collapse: collapse;}
.tableborder5  td {padding: 5px;}

 .parent{overflow: hidden;}

 .box1{
 	float: left;
 	width: 46%; 
	margin-right: 1%;
 	margin-left: 1%;
 	padding: 1%;
 }

.data {
      border: 1px solid black;
      border-collapse: collapse;
}
  
.data td {
      border: 1px solid black;
      border-collapse: collapse;
  }
  
.data td {padding: 5px;}

.leftduck{	
    float:left;
	width: 20%;		
}

.rightparagraph{
	float:left;
	width: 70%;
	margin: 2%;	
}

.orangebox{
	margin-top:2em;	
	padding:1em;
	border-radius:1em;
	border:5px solid #ff8c00;
}

.leftduck img {
	width: 100%;
	max-width: 400px;
}

.leftducklessons{	
    float:left;
	width: 20%;
	padding-bottom: 1%;
}

.rightparagraphlessons{
	float:left;
	width: 65%;
	margin: 2%;	
}

.leftducklessons img {
  width: 100%;
  max-width: 400px;
}

@media screen and (max-width: 800px) {
  .leftduck {
    width: 35%;
  }
  
@media screen and (max-width: 800px) {
  .rightparagraph{
    width: 95%;
  }  
  
@media screen and (max-width: 400px) {
  .leftducklessons {
    width: 35%;
  }
  
@media screen and (max-width: 400px) {
  .rightparagraphlessons{
    width: 100%;
  }


/*
.title {font-size: 120%; color: #828181;font-weight:bold;margin-bottom:5px;}

.normal {
	color:#828181;
	text-align:justify;}
.normal A:link {text-decoration: underline; color : #0081BB;}
.normal A:visited {text-decoration: underline; color : #0081BB;}
.normal A:active {text-decoration: underline;color: #993300;}
.normal A:hover {text-decoration: underline;color: #993300;}
.normal strong {color:#000000;font-weight:bold;}
.normal li {list-style-image: url(../images/bullet_orange3.gif);}
.normal li ul li {list-style-image: url(../images/bullet_orange.gif);}

.facileT A:link {text-decoration: none; color: #FFFFFF;}
.facileT A:visited {text-decoration: none; color: #FFFFFF;}
.facileT A:active {text-decoration: none;color: #FF9933;}
.facileT A:hover {text-decoration: none;color: #FF9933;}
.facileT ul {list-style-type: none;margin: 0; padding-top: 12px; padding-bottom: 11px; background-color: #330000;}
.facileT li {float: right; padding-left: 10px; padding-right: 15px; }

*/